Live data from Hacker News

CSS adds vertical centering in 2024

build-your-own.org

21–30 of 50 posts

Re: CSS adds vertical centering in 2024

#21

Why don’t top and bottom `auto` margins center things?

Doesn’t seem like that would play nice with margin collapsing, like what if you had two box elements with that style that would otherwise undergo margin collapsing, how should they render? What’s the baseline margin to combine if they should collapse and what’s the baseline margin to separate them if they shouldn’t?

Re: CSS adds vertical centering in 2024

#22
post #5

This was already a feature for flex box and grid. They’re just adding this to flow layout. Still a welcome addition but consider that all browsers that add support for this will already have support for flex and grid.

Bizarre that a statement of fact is being voted down.

Re: CSS adds vertical centering in 2024

#24
post #5

This was already a feature for flex box and grid. They’re just adding this to flow layout. Still a welcome addition but consider that all browsers that add support for this will already have support for flex and grid.

Bizarre that a statement of fact is being voted down.

Didn’t downvote (can’t even downvote, wouldn’t anyway), but if I were to guess it’s that the article talks about it fairly extensively.

Re: CSS adds vertical centering in 2024

#26

Earlier quoted context omitted.

Per the article, _align_ is for vertical distribution, and _justify_ is for horizontal. The example is actually behaving correctly. The naming is confusing though, imo

Ah! Thanks for the correction. Unfortunately it's not centered vertically either. It's in the top left.

Oh lol that’s not great

Re: CSS adds vertical centering in 2024

#27
post #21

Why don’t top and bottom `auto` margins center things?

Doesn’t seem like that would play nice with margin collapsing, like what if you had two box elements with that style that would otherwise undergo margin collapsing, how should they render? What’s the baseline margin to combine if they should collapse and what’s the baseline margin to separate them if they shouldn’t?

Just let me opt out of margin collapsing. That may be helpful if we’re dealing with paragraphs on a long piece of prose, but that’s decidedly not what I’m dealing with 95% of the time.

Even with all the cool layout props we have today, it’s way too complicated to say „make this thing fill the whole screen minus the navbar at the top, make it scrollable if the content overflows and Center it vertically otherwise“. Add a grid or sticky elements or z index modifications to the mix, and the quirks get loud fast.

Re: CSS adds vertical centering in 2024

#28
post #5

This was already a feature for flex box and grid. They’re just adding this to flow layout. Still a welcome addition but consider that all browsers that add support for this will already have support for flex and grid.

The article already addresses this. The point is to have the feature exist without having to know about flexbox/grid (or history).

Re: CSS adds vertical centering in 2024

#30
post #5

This was already a feature for flex box and grid. They’re just adding this to flow layout. Still a welcome addition but consider that all browsers that add support for this will already have support for flex and grid.

Learning flex box has great ROI for saving your time and sanity wrangling CSS.
Post reply on HN