3 ms·
>I'm not clear what you're describing with "flexbox scrolling"? "position: absolute" can be used to disrupt the two-way size propogation. Without it you either
by byko3y 6y ago
>I'm not clear what you're describing with "flexbox scrolling"?
"position: absolute" can be used to disrupt the two-way size propogation. Without it you either get shrinked content on y, flexbox wrapping problem on x, scroll appearing on a wrong element in some cases (or cropping for "overflow: hidden"), or you have to set width and height of the block with scroll using css "calc()" — all these solutions are ugly.
>My reasoning is that I want to prevent elements from overlapping and obscuring important information
The most simple example of overlapping elements is a background/border. You can look around this page and find a lot of overlapping graphical elements — it's not the problem, but overlapping text (and other content) is.
"CSS is awesome" example formally has no overlapping DOM elements, no "position" attributes. It's just a block with "border" style and "width" set to some fixed amount. Often this problem happens without border on the block and remains invisible, unless two such blocks are really close together and the text begins to overlap. Still no "position" involved though.