Earlier quoted context omitted.
I think I'd rather just manipulate HTML with Javascript. At least then I only have one problem, which is HTML with inline styles. No separate CSS file to maintain or CSS rule precedence to worry about.
You forgot the performance problem....
How to Center in CSS
161–170 of 297 posts
Re: How to Center in CSS
#162Re: How to Center in CSS
#163Re: How to Center in CSS
#164Earlier quoted context omitted.
Would this technique work to center, say, an tag with undeclared dimensions inside of a div? Or do you have to jump through hoops?
No, if you don't have a defined height you will need to either use "display: table", the table-cell technique, or flexbox. When I told the site that I had a defined height, however, it still suggested the table-cell trick, which was not the optimal solution because of the extra markup required. In my experience, most of the time when I do want to center something vertically, I have a defined height (which can be a pe…
Re: How to Center in CSS
#165Earlier quoted context omitted.
A basic rule of universe is that complexity remains, you can merely shift it around. The table layout algorithm might be incredibly complex, but I'd rather have a browser writer have the headaches than me.
> A basic rule of universe is that complexity remains, you can merely shift it around. Not really. CSS grid systems (like in Bootstrap) require some ugly and non-semantic markup, but they're not very complex.
[0]: https://www.ostraining.com/blog/coding/bootstrap-right-way/
Re: How to Center in CSS
#166Re: How to Center in CSS
#167Earlier quoted context omitted.
I also find it crazy how there was a huge campaign to remove use of the table tag for layout. 'It's non semantic! You're mixing layout and content!' people would cry over and over. .. But then we've ended up with bootstrap and it's grid layout, where we're doing exactly that, and for some reason it's perfectly fine.
Browsers should e.g. allow tables to be sorted by clicking column headers. They can't, because tables aren't always tables.
...
Re: How to Center in CSS
#168Re: How to Center in CSS
#169Earlier quoted context omitted.
The element has no semantic meaning, screen-readers don't read them and they have no intrinsic behaviour unless associated with an aria tag.
Why couldn't we just have made non-semantic tables? In addition to the semantic tables, I mean.
Re: How to Center in CSS
#170Earlier quoted context omitted.
You're in luck. foo { display: flex; /* opt into the new box model */ justify-content: center; /* "align" */ align-items: center; /* "valign" */ } Vendor prefixes may or may not ruin your day (for now), but the spec is there and is exactly what you want. CSS is no longer "badly broken" if that's your metric.
Sweet. I figure only 15 more years until we get two column layouts working, and then we'll finally be able to publish like it's 1979.