This was like a gut punch. Is this why software is so terrible? So many people just graduated bootcamps and never learned anything else?
How can you do web development or even React if you don't understand CSS?
11–20 of 106 posts
This was like a gut punch. Is this why software is so terrible? So many people just graduated bootcamps and never learned anything else?
How can you do web development or even React if you don't understand CSS?
> This is a set of chapters about CSS layout for people who already know CSS. Which seems like a small market, I admit. This was like a gut punch. Is this why software is so terrible? So many people just graduated bootcamps and never learned anything else? How can you do web development or even React if you don't understand CSS?
I wrote my first line of CSS more than 20 years ago, have dug my way through CSS specs and browser quirks a countless number of times, write a ton of CSS in my day job, and even I wouldn't claim to really understand CSS.
There are just too many hidden rules, too many edge cases, to really ever be certain you have now understood everything there is to understand.
EDIT: I mean, consider this guy's recent blog post[0] for instance. He claims that CSS is logical and, presumably, that he understands that logic. Yet his article contains a number of factual errors, as mentioned in the HN comments. Nevertheless, he writes about CSS on a regular basis, so I'm sure he understands a great deal about it. In other words: In the world of CSS, even experts and experienced veterans are prone to not understand everything in detail.
written before css grid and css columns? another z-index one: https://philipwalton.com/articles/what-no-one-told-you-about...
Yeah, according to https://book.mixu.net/ this was written in 2015, at nine years old I'd be worried about this not being super useful for modern CSS.
Given these articles are looking an underlying principles of the CSS layout process, I wouldn’t worry about it being out of date. Everything it covers certainly hasn’t changed (because so many websites would be very broken if they had), and new CSS will be built on the fundamental principles laid out here. So even if it doesn’t cover stuff like grid, it will definitely provided much need background information to help you understand the details of how grid works, generally build a better intuition around how both old and new CSS features work.
Totally aside, but the article reminded me. Does anyone remember when Firefox showed you the stacking context of elements on a web page? It had an exploded 3d view of all layers on a web page. Not sure if any extensions or browsers still have that feature?
What is the best way to learn css in depth? The official documentation is a little wierd about what is actual and what is not.
What do you mean by "official documentation"? The specification [1]? MDN [2]? [1] https://drafts.csswg.org/ [2] https://developer.mozilla.org/en-US/docs/Web/CSS The former is not meant as a learning resource for new web devs. And the latter (which is neither official nor authoritative) usually has information about the "baseline" support and browser compatibility tables.
What is the best way to learn css in depth? The official documentation is a little wierd about what is actual and what is not.
The best resource on CSS basics, I have found, is https://web.dev/learn/css. It includes flexbox and grid.
For design guidelines I recommend Refactoring UI. It is full of actionable advice, which books such as The UX book is lacking.
In my project I use TailwindCSS (by the author of Refacturing UI) with Daisy UI components, so I don't actually write raw CSS. At first TailwindCSS feels like a step backwards to inline CSS, but it is just better than the alternative. I recommend giving it a chance.
What is the best way to learn css in depth? The official documentation is a little wierd about what is actual and what is not.
I've found the best way is to build things over and over again. That may reflect a certain learning style but actually manipulating styles and layouts really helps hammer home the practical aspects of how it works. I also approach writing CSS with the goal of writing as little as possible. Not because I don't like it - I tend to think it gets an unfairly bad rap - but because it teaches you how to more effectively st…
Totally aside, but the article reminded me. Does anyone remember when Firefox showed you the stacking context of elements on a web page? It had an exploded 3d view of all layers on a web page. Not sure if any extensions or browsers still have that feature?
But yeah i also remember that feature fondly and if anyone has a better tool i'd be very interested! Super weird it isn't more used, but then again it's weird there isn't more 3d / 2d diagramming being standard in programming.
No, that's not exactly what float means! Yes you can accomplish this using floats, but we haven't since flexbox and grid landed. The element is taken out of the normal flow, and this is a confusing way to build layouts for those studying CSS.
`float` is more of a typographic tool. If this article calls itself pedantic, it needs more pedantry.
> This is a set of chapters about CSS layout for people who already know CSS. Which seems like a small market, I admit. This was like a gut punch. Is this why software is so terrible? So many people just graduated bootcamps and never learned anything else? How can you do web development or even React if you don't understand CSS?
> How can you do web development or even React if you don't understand CSS? I wrote my first line of CSS more than 20 years ago, have dug my way through CSS specs and browser quirks a countless number of times, write a ton of CSS in my day job, and even I wouldn't claim to really understand CSS. There are just too many hidden rules, too many edge cases, to really ever be certain you have now understood everything the…
Complete ditto. Been using it daily for a decade plus, and I could literally lay out a page perfectly while blindfolded at this point. But I would never claim to be a CSS "expert". Simply too many gotchas.