Best practice to place CSS rules

When laying out your rules for a CSS document, is there a best practice for how to lay them out? Should they be in the order they appear in the HTML file, or should they be like grouped?

It depends. I’d personally make a table of contents in a comment section with any big css file just to keep track of things and be able to run a quick search.

This is particularly useful when things get thick with media queries.

1 Like

I am uncertain that there is a single best practice.

There are a couple ways I like to do it. One is to style one portion of the page at a time, and divide each section with comments. For example, if your header is at the top of the page, you could write a comment stating the following selectors are for the header and then style everything within it.
You could then move to the next major portion of the webpage.

Another I like is the “Single Line with Indenting” method which I found here


In general though it depends on the page in question, as @toastedpitabread said,

This is very helpful :+1:

1 Like