🔥 Don't forget to follow me on Twitter! Let's link up. If you like this article, feel free to follow me, I'll be pushing out even more content soon...
For further actions, you may consider blocking this person and/or reporting abuse
I would add box-sizing:border-box; as one of the first things to declare, applicable to all divs. I find some people who are just starting out in CSS constantly frustrated by widths in nested situations.
Thanks for this, Lucas! CSS is one of those things that quickly get bloated for me, so having some sort of systematic approach based on a mock-up really helps. Have you looked into Object Oriented CSS: smashingmagazine.com/2011/12/an-in... ...I think there are many similar frameworks...
Happy to help!! Glad you like it, that's really good to hear.
I've not heard of OOCSS yet, I'll look into it!
Thanks! These tips answered a few questions I was already contemplating for my next session working on my portfolio site!
Very happy to help :)
What questions did I answer && what do you think could be improved? 🙌
Primarily, I liked the short list of styles to implement at higher levels with wide reaching effects. In my previous experience, formatting and placement have always been the biggest nightmares of CSS, so I'm a big fan of keeping it as simple as possible. This seems like a great starting point with some additional tips and resources on where to go once that is achieved.
Thank you so much for the compliment, the list-style instruction is really what I go for to make it really easy and fast to read and/or scan 👍
Why shouldn't you think about styling as much as other aspects of the UI?
Thank you for your question! I meant that I often go into styling my web-app without a proper plan of attack. This often leaves me making dumb organizational mistakes or getting confused at what I was really trying to do. That's why I wrote this cheat sheet.
Excellent cheat sheet Lucas. This answered a few things I was wondering about flexbox. Thanks.
Super happy to hear that!!!
Excellent. And I appreciate the closing point: Don't forget to learn the basics!
I saw an interesting debate about that earlier. People learn Bootstrap before CSS and that's not a healthy trend. Glad you liked it, that's really good to hear!
Hi
Good article. I'll try to practice this for help me when frontend programmer cannot do it immediately.
Hope it helps! :)
This article is my thoughts put into words for what I want to/have been teaching to my junior colleagues. Very well written, well though out. A must read for beginners and up.