When I first started getting into CSS, I was intimidated! HTML had been so straightforward but CSS wasn’t. There was no “RIGHT” way to do things, but then again, there sort of was. So confusing!
If you’re new to CSS, don’t stress. We ALL go through frustrating, annoying, and sometimes downright scary moments with CSS—it’s all part of the process (really!).
This Halloween, check out the 3 things about CSS that first spooked me–then share your own!
1. Those Devious <DIVS>
It takes a while to realize that divs are just friendly containers, chunking up your content so that you can style parts of it with CSS. I wasn’t sure what the div etiquette was so in my first days of CSS, I put EVERYTHING inside of a div. Turns out I was seriously overcompensating for not understanding exactly how and when to use them.
The best cure for this is to look at the source code of other sites, see how folks have used divs, and challenge yourself to use them very sparingly.
2. Pain in the Class or is it ID?
These were just annoying to me. Why not just use class for everything? Turns out, that wasn’t such a bad thought as many have debated class vs ID over the last few years. IDs are certainly valid, but context is everything. Take a moment to read this piece on why.
3. Fearsome Floats
You knew this was coming. Everyone hates floats at first. Seriously, everyone. They seem stubborn, and quite frankly – rude! Add to that positioning and it’s enough to make you shriek like a banshee. However, understanding floats, positioning and the clear property, are key to becoming a CSS whiz. Don’t worry – this should take some time to get down, and you will need to practice with example sites/layouts.
Check out this piece to get a great overview of floats and then get to practicing.
Frustrating moments are a PART of the tech process. EVERYONE at every skill level goes through it…and not just in the beginning! The biggest tech skill is also a life skill–perseverance.
With some resourcefulness and gusto, you can look your CSS ghosts in the face and conquer them.
And if you want to actually create a CSS ghost, check out the Codepen below!