Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Hardest problem in computer science: centering things

tonsky.me

Post reply on HN
Print view View original

381–390 of 473 posts

Re: Hardest problem in computer science: centering things

#381

Post by ajmurmann »

coldtea wrote: post #292
bazoom42 wrote: post #265

Earlier quoted context omitted.

CSS never recommended float/clear as an alternative to table-based layout. CSS had ‘display:table’ for when you needed a tabular layout without the semantic baggage of the table-tag.

CSS is just a language + words of paper spec. CSS, as in "CSS evangelists", influential web designers, guidelines in web development resources, books, and so on, recommended and advocated for the use of clear/float. You might not have been there, but float layout was a big thing back then, and everybody was guilt-pressured to use that - neither tables, nor "display: table" (which was used by some, but also discourage…

'display: table' wasn't consistently supported and '' for layout caused issues for screen readers because they (rightfully) expected content that's tabular in nature.

Re: Hardest problem in computer science: centering things

#382

Post by karaterobot »

crazygringo wrote: post #20
karaterobot wrote: post #10

I'm out of the web development game, but in my day it was still quite possible to vertically center text and icons consistently. You just had to notice it was busted in the first place, and then go in and fix it. It's not a technological problem, or at least not a non-trivial one. The problem is that, if it's off by a couple pixels, the front-end engineer may not notice it, and the designer may not even look at it. O…

No, this was never possible, not in web development. You could do it in one browser on one OS, but then they could be off on another browser on another OS. It's absolutely a technological problem because pixel-perfect rendering and alignment is not part of the HTML/CSS specs, when it comes to how fonts get drawn. The only way to actually get it perfect is to do browser and OS detection and then hand-code a bunch of m…

> The only way to actually get it perfect is to do browser and OS detection and then hand-code a bunch of manual offsets that you keep up to date. And obviously that would be insane.

That's exactly what you do. And that's what I'm saying: the view that the product we're making is not worth doing one-off fixes for, that we need one solution for everything. No other trade has this delusion about everything being a perfect system you can control from a single commanding height (a component library, for example). Even other forms of programming, like game development, don't pretend you can avoid doing one-offs. Just web development, as far as I can tell.

Re: Hardest problem in computer science: centering things

#383

Post by throwitaway222 »

Maxion wrote: post #98
dr_kiszonka wrote: post #78

Don't read this article, if you are not in web dev. Once you start seeing it, you can't stop seeing it, and it will drive you crazy forever. It is the same for noticing misalignment, recognizing color oversaturation, high quality speakers/headphones, etc. (It is a good article!)

The same happens when you: - Install flooring - Install trim in your own home - Build / install cabinets You will now see: - Odd flooring patterns and uneven floors - Know what it looks like when trim isn't coped - Uneven gaps between doors

I have a wall outside where the siding is off 1/4" on one side and it drives me insane. No one but me knows it was off.

Re: Hardest problem in computer science: centering things

#384

Post by cdrini »

Inviz wrote: post #103
cdrini wrote: post #62

Earlier quoted context omitted.

I wonder if something like this would've worked. I always mentally think of flex box as having a primary axis that's like a rope that runs through the container, and the children are stuck onto this rope. ``` display: flex; // The flex axis is the axis where items get added. So horizontal would add things to the right, vertical to the bottom flex-axis: horizontal; flex-axis-align: center; // Normal as used in math to…

CSS goes away from left/right in general. See inline-* and block-* family of properties. This is to support RTL and vertical writing modes easier.

I don't use left/right anywhere in the CSS above...

Re: Hardest problem in computer science: centering things

#386

Post by sonicanatidae »

dr_kiszonka wrote: post #78

Don't read this article, if you are not in web dev. Once you start seeing it, you can't stop seeing it, and it will drive you crazy forever. It is the same for noticing misalignment, recognizing color oversaturation, high quality speakers/headphones, etc. (It is a good article!)

Bad Kerning is what drives me nuts, like how can the person that did it look at it and think, "we're good!"... le rage

edit: ahh.. a vote for bad kerning. lol

Re: Hardest problem in computer science: centering things

#387

Post by nsajko »

atoav wrote: post #119
strogonoff wrote: post #81

If there’s anything I learned from studying design and typography, it’s that there’s no singular correct rule you can use to align things. Use precise measurements for your margins? Someone will say that perceptually it’s not symmetrical, and rightfully point out that perceived symmetry is the only one that matters . Adjust visually for your hanging punctuation, ascenders and descenders? Someone will draw a bunch of…

Jup. Somw people like to think centering things is taking the bounding box of the visible pixel and centering the center of the bounding box. But some letters have more pixels in one half or the other, so that would leave you with more whitespace one one or the other side. That means despite being metrically centered it still doesn't look optically centered. I guess one could devise algorithms for that, but I haven't…

Not an expert, but I think your example is actually a solved issue nowadays: https://en.wikipedia.org/wiki/Microtypography

I know the newer TeX engines, for example, support microtypographical corrections.

Re: Hardest problem in computer science: centering things

#388

Post by nonfamous »

account42 wrote: post #285
dr_kiszonka wrote: post #78

Don't read this article, if you are not in web dev. Once you start seeing it, you can't stop seeing it, and it will drive you crazy forever. It is the same for noticing misalignment, recognizing color oversaturation, high quality speakers/headphones, etc. (It is a good article!)

Hi I heard you might like to learn about keming.

Leam to kem.

Re: Hardest problem in computer science: centering things

#390

Post by PaulHoule »

dr_kiszonka wrote: post #78

Don't read this article, if you are not in web dev. Once you start seeing it, you can't stop seeing it, and it will drive you crazy forever. It is the same for noticing misalignment, recognizing color oversaturation, high quality speakers/headphones, etc. (It is a good article!)

I showed my wife (who teaches people to ride horses) some photos of a woman in China with a horse and her comment was "Why is the halter twisted?"

I went to an MLS game with someone who had been a soccer ref and he pointed out that the line on the side of the field wasn't perfectly straight.

Post reply on HN