Nope, you're not going to hear that from me either! I agree there was a point where CSS was very fiddly, and it drove non-techy designers and non-artsy devs alike pretty crazy. But... times have changed a lot. Flexbox and Grid are widely supported, and should form part of everyone's layout arsenal, as I'm sure you agree. No, I'll go even further—Grid and Flexbox should probably be the starting point of almost every design, going forward. Every dev should burn two or three grid-based layouts into their brains and just reach for them every time, assuming they remain unmotivated to outright play around with them for the sheer fun of it.
That said, I do have a few real remaining bones to pick with CSS; it still doesn't cover a number of use cases that I've found annoying. The promise of CSS to completely decouple styling and layout from content has not yet been 100% fulfilled, and because it does so much right otherwise, it bothers me when it fails. For example, if you have long article, there's no way to split it naturally into page-like viewport-high multi columns without introducing JS. Also, a number of properties don't work with inline SVGs like you might figure they would, especially (in my case) box-shadow. The inability to target text overflow at the word level has also messed me up in the past, though maybe this is less CSS and more HTML/JS.
These are advanced use-cases, though, and it bugs me when people complain about solved problems like basic layouts. Not that I'm completely unsympathetic, just that it's overblown.
Someone who understands me. Finally!😍 I'm glad that I'm not alone on this styling world 🙌
And more seriously - well I wasn't working in the era of 'bad css' but I hear a lot that it's difficult, flex or grid is not clear (🤷), etc.
I agree that some things can be tricky like layouts, margins, after/before. But I believe that basics can be learned in less than a week if you really want it need it.
Before the box-sizing: border-box property, padding used to add to the overall size of a container, so if you had a div that was 300px with a padding of 5 px, you would need to remember that your div would now be 310px.
Before Grid and Flexbox, everyone would have to play around with float properties and z-indexing, which is sometimes a little like trying to keep oil bubbles in water neatly organized.
And before fr-units and maybe the calc function (which itself is mathy and thus not really ideal), you used to have to do weird math yourself, like if you had three columns you might have to manually subtract percentages from gaps and wind up with things like "31. 3333% 5px 31.3333% 5px 31.3333%".
It's the reason why people reached for pre-made grid systems like the infamous and then-handy 960 Grid (which hilariously still exists, though I guess that's good from a historical viewpoint), and later for CSS frameworks like Bootstrap and Foundation... which sadly, a lot of people still do, and which drives CSS senseis Jen Simmons and Rachel Andrew crazy.
But I agree—I think plenty of devs are not giving themselves enough credit and just learning modern CSS.
Nope, you're not going to hear that from me either! I agree there was a point where CSS was very fiddly, and it drove non-techy designers and non-artsy devs alike pretty crazy. But... times have changed a lot. Flexbox and Grid are widely supported, and should form part of everyone's layout arsenal, as I'm sure you agree. No, I'll go even further—Grid and Flexbox should probably be the starting point of almost every design, going forward. Every dev should burn two or three grid-based layouts into their brains and just reach for them every time, assuming they remain unmotivated to outright play around with them for the sheer fun of it.
That said, I do have a few real remaining bones to pick with CSS; it still doesn't cover a number of use cases that I've found annoying. The promise of CSS to completely decouple styling and layout from content has not yet been 100% fulfilled, and because it does so much right otherwise, it bothers me when it fails. For example, if you have long article, there's no way to split it naturally into page-like viewport-high multi columns without introducing JS. Also, a number of properties don't work with inline SVGs like you might figure they would, especially (in my case) box-shadow. The inability to target text overflow at the word level has also messed me up in the past, though maybe this is less CSS and more HTML/JS.
These are advanced use-cases, though, and it bugs me when people complain about solved problems like basic layouts. Not that I'm completely unsympathetic, just that it's overblown.
Someone who understands me. Finally!😍 I'm glad that I'm not alone on this styling world 🙌
And more seriously - well I wasn't working in the era of 'bad css' but I hear a lot that it's difficult, flex or grid is not clear (🤷), etc.
I agree that some things can be tricky like layouts, margins, after/before. But I believe that basics can be learned in less than a week if you really want it need it.
It did use to be tricky, I'll admit!
Before the
box-sizing: border-boxproperty, padding used to add to the overall size of a container, so if you had a div that was 300px with a padding of 5 px, you would need to remember that your div would now be 310px.Before Grid and Flexbox, everyone would have to play around with float properties and z-indexing, which is sometimes a little like trying to keep oil bubbles in water neatly organized.
And before fr-units and maybe the calc function (which itself is mathy and thus not really ideal), you used to have to do weird math yourself, like if you had three columns you might have to manually subtract percentages from gaps and wind up with things like "31. 3333% 5px 31.3333% 5px 31.3333%".
It's the reason why people reached for pre-made grid systems like the infamous and then-handy 960 Grid (which hilariously still exists, though I guess that's good from a historical viewpoint), and later for CSS frameworks like Bootstrap and Foundation... which sadly, a lot of people still do, and which drives CSS senseis Jen Simmons and Rachel Andrew crazy.
But I agree—I think plenty of devs are not giving themselves enough credit and just learning modern CSS.
I have never heard this put better.