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

CSS adds vertical centering in 2024

build-your-own.org

Post reply on HN
Print view View original

31–40 of 50 posts

Re: CSS adds vertical centering in 2024

#31

Post by eyelidlessness »

CM30 wrote: post #16

Still surprised it took so long. Feels like the folks working on CSS have some really weird prioritites when it comes to deciding what to work on and what to add.

Vertical centering has been trivial in numerous ways for many years. At least since flexbox. This is mostly a convenience to achieve what flexbox already did, with a simpler (albeit more error prone) imposition on document structure.

With that in mind, which “really weird priorities” would you have deprioritized relative to this convenience?

Re: CSS adds vertical centering in 2024

#33

Post by ffsm8 »

wryoak wrote: post #21
lelandfe wrote: post #10

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?

Why would that be an issue? Isn't it fundamentally the same as with the horizontal centering via margin: auto for inline-blocks?

Re: CSS adds vertical centering in 2024

#34

Post by throwitaway1123 »

CM30 wrote: post #16

Still surprised it took so long. Feels like the folks working on CSS have some really weird prioritites when it comes to deciding what to work on and what to add.

I'm also frequently surprised at how long certain CSS features take to implement. Some recent examples for me are the `has:()` pseudo selector [1], the scripting media queries [2], and css nesting [3].

[1] https://caniuse.com/css-has

[2] https://caniuse.com/mdn-css_at-rules_media_scripting

[3] https://caniuse.com/css-nesting

Re: CSS adds vertical centering in 2024

#36

Post by The_Colonel »

eyelidlessness wrote: post #31
CM30 wrote: post #16

Still surprised it took so long. Feels like the folks working on CSS have some really weird prioritites when it comes to deciding what to work on and what to add.

Vertical centering has been trivial in numerous ways for many years. At least since flexbox. This is mostly a convenience to achieve what flexbox already did, with a simpler (albeit more error prone) imposition on document structure. With that in mind, which “really weird priorities” would you have deprioritized relative to this convenience?

Indeed, since at least 1997, when HTML 3.2 standardized tables.

Re: CSS adds vertical centering in 2024

#37

Post by JimDabell »

lelandfe wrote: post #10

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

Because our writing system is unidirectional. Documents have a direction that they flow in (typically vertical), and text within those documents is written along the other axis (typically horizontal) and wraps when it hits the edge. So in a viewport, a document has three fixed edges defined by the viewport dimensions (typically top, left, and right), with the other edge (bottom) defined by the size of the content. So the horizontal axis works in a very different way to the vertical axis.

Re: CSS adds vertical centering in 2024

#38

Post by Levitz »

eyelidlessness wrote: post #31
CM30 wrote: post #16

Still surprised it took so long. Feels like the folks working on CSS have some really weird prioritites when it comes to deciding what to work on and what to add.

Vertical centering has been trivial in numerous ways for many years. At least since flexbox. This is mostly a convenience to achieve what flexbox already did, with a simpler (albeit more error prone) imposition on document structure. With that in mind, which “really weird priorities” would you have deprioritized relative to this convenience?

I don't think it's fair to dismiss something as "convenience". Convenience is very important in development, convenience is the reason we use CSS to begin with.

The idea of centering an element within another is extremely basic. Something someone might want to do literally within the first 30 minutes of touching CSS for the first time and historically that person, who probably expected some evident answer instead found a 5000 vote post in stackoverflow with information on flexbox, margin auto, text align and half a dozen hacks for different situations.

Like I can do a js implementation of array.has() in a couple of minutes. I would still be shocked if it was never implemented by default and it got implemented now.

Re: CSS adds vertical centering in 2024

#39

Post by extra88 »

throwitaway1123 wrote: post #34
CM30 wrote: post #16

Still surprised it took so long. Feels like the folks working on CSS have some really weird prioritites when it comes to deciding what to work on and what to add.

I'm also frequently surprised at how long certain CSS features take to implement. Some recent examples for me are the `has:()` pseudo selector [1], the scripting media queries [2], and css nesting [3]. [1] https://caniuse.com/css-has [2] https://caniuse.com/mdn-css_at-rules_media_scripting [3] https://caniuse.com/css-nesting

The `scripting` @media query isn't very useful. If you want CSS that's in effect when the browser doesn't have JavaScript, you can put those styles inside . More commonly, use JavaScript itself to add or remove a class that is used within the relevant selectors. Only using JavaScript itself is potentially effective when script-blocking extensions are used rather than JavaScript not being available at all.

`:has()` is very clever, powerful, and has been desired for a long time. However, even if someone figured out how to implement it twenty years ago, it probably still couldn't have been used for performance reasons.

CSS nesting may have also been infeasible for performance reasons.

Re: CSS adds vertical centering in 2024

#40

Post by [deleted] »

JimDabell wrote: post #37
lelandfe wrote: post #10

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

Because our writing system is unidirectional. Documents have a direction that they flow in (typically vertical), and text within those documents is written along the other axis (typically horizontal) and wraps when it hits the edge. So in a viewport, a document has three fixed edges defined by the viewport dimensions (typically top, left, and right), with the other edge (bottom) defined by the size of the content. So…

[deleted]
Post reply on HN