Live data from Hacker News

Full-Bleed Layout Using CSS Grid

joshwcomeau.com

191–200 of 277 posts

Re: Full-Bleed Layout Using CSS Grid

#191
post #159

Earlier quoted context omitted.

The new IE.

Wouldn’t that be Chrome? The ubiquity leads to lazy developers testing only on it. Maybe some fancy SVGs saying “Best viewed on Chrome!” To really rub it in :)

No, the definition of "the new IE" is to not support the latest features.

Pick some other phrase for "most popular"

Re: Full-Bleed Layout Using CSS Grid

#192
post #185

Earlier quoted context omitted.

Very disingenuous of you. IE was a trashfire because it refused to do anything in a standard way, meaning it had to be specially catered for. Safari is slow to follow the standards but at least its compliant. A engine that isn't Chrome is very essential for keeping the web open, especially since Firefox user share keeps going down.

slow to follow the standards Safari is not only slow to follow the standards, it is slow to advance the standards. I'd be more likely to believe the spin that Apple just wants to make sure things are done well on the web if it appeared that they were trying as hard to add good, new capabilities to the web platform as they are to add good, new capabilities to iOS. A engine that isn't Chrome is very essential for keepi…

Apple is only able to do this because of the monopoly of browser engines for 1.5 billion iOS devices. If they allowed (or were forced to allow) other browser engines then likely a large number of users would switch to another browser, forcing Apple to compete for features.

Re: Full-Bleed Layout Using CSS Grid

#193

Earlier quoted context omitted.

I think CSS is "difficult to understand" because most people who do front-end don't want to spend a day learning it. Ask some people who make the claim it's difficult: what is the box model, and what is selector specificity. I can almost guarantee they won't be able to answer those questions, because they haven't bothered to actually try to learn CSS. Their knowledge of CSS is built from a set of "how do I do X in CS…

I've been writing CSS for about 10 years at nearly every professional job I've had. I don't get 'stuck' often and generally feel competent, but I am far from an expert or a master. I think CSS is difficult to understand because there are so many ways to accomplish a task, and so many of those ways lead to (sometimes) unforeseeable consequences, and nearly all of the APIs (possibly with the exception of css grid) don'…

Yeah I think working with CSS is like working with Databases. There are a lot of ways in databases to get the job done. At first glance it seems to work the way you want and even survives early testing or even deployment. It doesnt fall apart until much later when you are trying to build upon it, scale it, etc.. This causes many people to learn the wrong way to do something because they might not stick around until it falls apart. The next time they have to do something they remember the way they got it to work last time and do it again, never realizing they are leaving a trail of tears for future developers to clean up the mess with.

CSS is very much the same way. I can't tell you how many times I have seen CSS files that are a house of cards. One wrong element gets added into a markup and the whole thing crumbles. Unnecessary use of !important, wildcards, overly specific, not specific enough, inconsistent media queries, desktop-first layouts (as opposed to mobile-first, or often times a mixture of the two depending on the element), and so on. At first glance, the stakes for bad CSS also seem pretty low (which is not the case with databases or backend code). This further causes developers to just hack at it until it works or is "close enough". It instills bad habits that last years or even entire careers.

Re: Full-Bleed Layout Using CSS Grid

#194
The article states, "Research has shown that the ideal line length is about 65 characters." but it links to a pdf. I skimmed several pages and found one statement that said what the average length was but I found mention of research on the ideal line length. The Smashing Magazine article linked says 65 is just a general rule derived from 2.5 times the Roman Alphabet.

Is there any actual research on this number?

Re: Full-Bleed Layout Using CSS Grid

#195
post #159

Earlier quoted context omitted.

The new IE.

Very disingenuous of you. IE was a trashfire because it refused to do anything in a standard way, meaning it had to be specially catered for. Safari is slow to follow the standards but at least its compliant. A engine that isn't Chrome is very essential for keeping the web open, especially since Firefox user share keeps going down.

A browser engine that's primarily used on platforms where it's mandatory, and cannot be uninstalled or replaced, is "very essential for keeping the web open"?

Re: Full-Bleed Layout Using CSS Grid

#196

The article states, "Research has shown that the ideal line length is about 65 characters." but it links to a pdf. I skimmed several pages and found one statement that said what the average length was but I found mention of research on the ideal line length. The Smashing Magazine article linked says 65 is just a general rule derived from 2.5 times the Roman Alphabet. Is there any actual research on this number?

From what i recall, the 65-75 char count for web comes from The Elements of Typographic Style by Robert Bringhurst

Re: Full-Bleed Layout Using CSS Grid

#197

Earlier quoted context omitted.

ch is based on the width of a "0" character, em is based on the font size, which is the height of the character. for setting widths of things that contain text ch makes more sense. For padding, spacing, font sizes, inline symbols, and that kind of thing, em makes more sense.

An em is historically based off the width of the letter M in a typeface. https://iamvdo.me/en/blog/css-font-metrics-line-height-and-v... is a fun deep dive into font sizing, which is pretty hairy.

That was my understanding as well. em was used for width and ex used for height.

Re: Full-Bleed Layout Using CSS Grid

#198

Earlier quoted context omitted.

Two reasons. One, the designer of the site has a specific UX and UI in mind, and that is their decision. If you don't like it, you can hack it with local CSS or just use a different site. Two, (I know you don't care, but for others reading) there are studies that show that for the vast majority of people, width constraints make it easier to read. So there is good reason to enforce those constraints in the design from…

I guess my rant should be more directed towards browsers. I remember Netscape allowing me to specify all sorts of stylistic preferences. Hell, I could easily make your web site's background be a brick wall if I wanted to. Most those things have kind of disappeared by now, and we're left with CSS hacks, "Disable CSS" and "Reader Mode". Oh and I guess we can set default fonts and colors too, but those just get over-rid…

Yah, I definitely miss the days of providing your own user style sheet without plugins or other addons. These days I don't hardly bother, although I will pop open the dev tools to "fix" something once in a while if it's really bad.

Re: Full-Bleed Layout Using CSS Grid

#199

Earlier quoted context omitted.

I find it really frustrating when project runners refuse to acknowledge shortcomings. I'm not always expecting them to solve it, but I'd at least like an acknowledgement that the issue I'm facing is valid. Pretending it's just me or that the obviously worse alternative is okay gets annoying. One example is ReasonML's async story: Q: What's BuckleScript's async story? A: If you're not interfacing with any library that…

Perfect use of "performant" as a nonsense pseudo-adjective, to signal sarcasm and condescension. If they are semi-serious, then "cromulent" would be a better synonym for "(marginally) acceptable."

Yeah, it might have embiggened their presentation

Re: Full-Bleed Layout Using CSS Grid

#200
post #160

I implemented something like this on my website [1] and I'm not really sold on it and I'm considering changing back. The two things that I've lost are collapsing margins between paragraphs/headers and the ability for any asides (like a floating image or a footnote) to vertically span multiple paragraphs. For margins between paragraphs I replaced them with grid-gap, but always having the same grid-gap is not great; yo…

I recommended dropping vertical margin and instead using exclusively margin-bottom (or padding-bottom) as much as possible. The behavior is generally more intuitive, and you'll get the control you're looking for.

In my case each subsequent paragraph, heading, or object is it's own grid row, which act like table rows where margins cannot collapse. Thus things like headings having a certain whitespace above them aren't possible without margin-top, among other small annoyances. Hence the reason I want to switch :)
Post reply on HN