Hacker News new | ask | show | jobs
by susam 1742 days ago
Dreading CSS? But CSS is awesome! [1]

On a serious note, yes, CSS can indeed be dreadful. I learnt CSS back in 2001 when geocities.com/username was the equivalent of today's username.github.io. The web was simpler and wacky. My approach back then was to design simple websites and then tweak it little by little by adding CSS. Much like learning shell scripting, I think it takes a lot of practice to become fluent in CSS. After encountering a lot of weird issues and learning to resolve them or work around them, one learns to be able to write good CSS quickly that does what is desired while avoiding all its surprises and pitfalls.

My biggest learning moments while learning CSS were also some of the most frustrating moments, e.g., very long words breaking float containment, floats breaking div containment, etc. and then searching blogs on the web (Stack Overflow did not exist yet) to find a fix! A typical fix would look like black magic, e.g., add 'overflow: hidden' for Firefox and IE7, add another 'display: block' for IE6, and hope for the best!

After writing HTML and CSS in this manner like a caveman for those 4 years initially, Firebug arrived in 2005. Firebug, the precursor to today's integrated developer tools, was a game changer! I no longer needed to set backgrounds and borders around every HTML element to figure out how they were rendered and what was breaking. Firebug allowed me to inspect the box model and reason about it with ease. Using the browser developer tools and becoming fluent with the CSS box model is critical to learning CSS these days, I think. In fact, these days, I just open the browser developer tools and edit the styles on the fly to see the results live without having to refresh or rebuild the page. Learning CSS has become easier than before, although not as easy as I would like.

After about two decades of making fancy layouts with CSS, I have now gone back to making really simple web pages that just show a header, the content, and a footer. It feels much calmer this way! Yes, I know that MVPs these days are not built like this anymore. Nevertheless, starting simple and doing simple tweaks, at least for a hobby project could be a good way to learn CSS in my opinion!

[1] https://i.imgur.com/9qzBYbH.jpeg