6 ms·

There are a bunch of comments commenting on other comments so I'm going to join in. These comments are largely talking about how centring is hard from an imple

There are a bunch of comments commenting on other comments so I'm going to join in. These comments are largely talking about how centring is hard from an implementation standpoint and can mean different things. Sure, but the whole "CSS centre meme" is just "How do I put one element dead centre within another". I can't point to data to back this up, but I'm pretty sure that's what 99% of people mean when they ask "Why is centring so hard?" For those of us who grew up with GeoCities and AngelFire etc, the reason not being able to easily do this felt so ridiculous and why it was hard to buy that it's hard to implement is that we were able to do this no problem with HTML, and still can! <table> <tr> <td width="600" height="600" bgcolor="yellow" align="center" valign="middle">hello</td> </tr> </table> That puts the text "hello" squarely in the middle of a 600x600 yellow box [0]. This worked in the 90s. I know nothing about the implementation of CSS, but surely you can understand the annoyance of been handed a new tool, told it's better, yet wasn't able to do such a standard thing lots of people were already doing. It's a big reason I didn't listen to the dogma and kept up with table layouts into the late 2000s. PS, maybe it's Stockholm Syndrome, but I love CSS FWIW. [0] You actually don't even need the `valign` which surprised me, at least not in chromium... I'm not sure if that is a recent thing because I haven't actually written code like that in around 15 years.

koito17 3y ago
Works in Firefox, too, without the "valign" attribute. Though I would not rely on auto-layout behavior in general since I've always seen subtle differences across the three major browsers whenever using tables without a fixed layout.
filleduchaos 3y ago
You've been able to do exactly what you describe (i.e. putting "hello" squarely in the middle of a 600x600 yellow box) with CSS since its first incarnation, with e.g. the `valign` HTML attribute corresponding to the `vertical-align` CSS property on an `inline`, `inline-block` or `table-cell` box. But then again, in my experience many of the people who wax poetic about just using tables and/or complain about how CSS is limiting and confusing...never actually put in much of an effort to learn how it works. At least the article's author is self-aware about this.
- rablackburn 3y ago
  >> You've been able to do exactly what you describe (i.e. putting "hello" squarely in the middle of a 600x600 yellow box) with CSS since its first incarnation, with e.g. the `valign` HTML attribute corresponding to the `vertical-align` CSS property on an `inline`, `inline-block` or `table-cell` box. Notably not a `block` element like a div or p - which is what most people are going to use as a container.
  - filleduchaos 3y ago
    ...the entire point of CSS is that you can style any element (almost) however you want, which includes changing how it's laid out by the browser. Case in point - unlike with HTML alone where `valign` only works on table-related elements, you can set `vertical-align` with a compatible `display`/layout algorithm on a div, p, etc as you wish.
- anticodon 3y ago
  In 2000-2010 not only I was a fullstack developer, but also had to write CSS and HTML code for the websites I worked on often. I remember that as an extremely painful experience. I can't remember all the details, but I remember that until flexbox and grid were implemented, everything CSS related was a pain. I vaguely remember that until 2008-2009 (maybe I'm off by 1-2 years) something trivial as rounded corners also was a pain. I also remember that about 80% of the CSS pain was caused by Microsoft Intenet Explorer 6.0. It was complete garbage when dealing with CSS and Javascript (I was working with huge JS codebases at the time). But nobody in the web world could ignore it because it had a huge market share. I hate that browser and Microsoft with passion till this day. So many hours, days, weeks wasted to make everything work in a browser that wasn't updated by MS (why spend money when everybody is using it - they even fired the team that worked on it) and had a very "specific" implementation of Web standards.
  - xp84 3y ago
    You’re 100% correct in your recollections and the frustration of using CSS in those days contributed to me not wanting to keep working on the front end at all. And yes, F MSIE all the way to hell How many thousands of human lifetimes were spent trying to make that piece of crap work. I still don’t know flexbox because I had given up by then. Thankfully I can have ChatGPT help me these days if it comes up, but thankfully FE is not really a part of my normal job.

koito17 3y ago

Works in Firefox, too, without the "valign" attribute. Though I would not rely on auto-layout behavior in general since I've always seen subtle differences across the three major browsers whenever using tables without a fixed layout.

filleduchaos 3y ago

You've been able to do exactly what you describe (i.e. putting "hello" squarely in the middle of a 600x600 yellow box) with CSS since its first incarnation, with e.g. the `valign` HTML attribute corresponding to the `vertical-align` CSS property on an `inline`, `inline-block` or `table-cell` box. But then again, in my experience many of the people who wax poetic about just using tables and/or complain about how CSS is limiting and confusing...never actually put in much of an effort to learn how it works. At least the article's author is self-aware about this.

rablackburn 3y ago
>> You've been able to do exactly what you describe (i.e. putting "hello" squarely in the middle of a 600x600 yellow box) with CSS since its first incarnation, with e.g. the `valign` HTML attribute corresponding to the `vertical-align` CSS property on an `inline`, `inline-block` or `table-cell` box. Notably not a `block` element like a div or p - which is what most people are going to use as a container.
- filleduchaos 3y ago
  ...the entire point of CSS is that you can style any element (almost) however you want, which includes changing how it's laid out by the browser. Case in point - unlike with HTML alone where `valign` only works on table-related elements, you can set `vertical-align` with a compatible `display`/layout algorithm on a div, p, etc as you wish.
anticodon 3y ago
In 2000-2010 not only I was a fullstack developer, but also had to write CSS and HTML code for the websites I worked on often. I remember that as an extremely painful experience. I can't remember all the details, but I remember that until flexbox and grid were implemented, everything CSS related was a pain. I vaguely remember that until 2008-2009 (maybe I'm off by 1-2 years) something trivial as rounded corners also was a pain. I also remember that about 80% of the CSS pain was caused by Microsoft Intenet Explorer 6.0. It was complete garbage when dealing with CSS and Javascript (I was working with huge JS codebases at the time). But nobody in the web world could ignore it because it had a huge market share. I hate that browser and Microsoft with passion till this day. So many hours, days, weeks wasted to make everything work in a browser that wasn't updated by MS (why spend money when everybody is using it - they even fired the team that worked on it) and had a very "specific" implementation of Web standards.
- xp84 3y ago
  You’re 100% correct in your recollections and the frustration of using CSS in those days contributed to me not wanting to keep working on the front end at all. And yes, F MSIE all the way to hell How many thousands of human lifetimes were spent trying to make that piece of crap work. I still don’t know flexbox because I had given up by then. Thankfully I can have ChatGPT help me these days if it comes up, but thankfully FE is not really a part of my normal job.