CSS methods: i have empty CSS file and where do i begin?

I’ve had some problems dealing with certification projects in Responsive Web Design course. Didn’t have issues in terms of passing tests, but after that i decided to give my Survey Form some style.
And I realized that I have very little idea what should I do first and what after that and etc.
I tried to use some consistency in my approach, meaning:

  1. Give style to body

  2. Give style to direct children of body

3.Give style to ‘grandchildren of body’ etc.

So it became a little easier, but i have a suspicion it will be not enough in the future, more diffcult tasks. Any advices/suggestions/tips how to organize work on CSS file?


You had the right idea!
For small projects at your level you can keep it simple:
Start with rules that are valid in all or most parts of your project.
*/ body/ html or costum properties are your tools.

After that you can start to costumize local elements like navbars
and their parts. Best follow the html structure of your project and
style accordingly, from top to bottom.

Try to implement short versions of code to save space and processing
power when you know them, like instead of writing the margin of an
object in four lines, use margin: top right bottom left;.

It’s great that you are already trying to organize your code, it
will help you later on. In larger projects the codebase becomes
so big that you can’t squeeze it on one poor CSS page. In React for
example almost every button becomes a component with it’s own
page and folder.

Happy hacking!