A New Way to Order CSS Rules
Here’s a new way to order your CSS rules: instead of ordering CSS rules alphabetically, try ordering them contextually. By ordering this way you save yourself the hassle of going through your alphabetical list, humping from W for width to H for height when they should be together.
- Sizing (width, height)
- Positioning (position, z-index, float)
- Padding and Margins (padding, margin)
- Typography (font, line-height, text-decoration)
- Color, Background, Opacity (color, background, opacity)
- Borders (border)
- Content Specific Settings (list-style)
- Usability Hacks* (text-indent)
- Miscellaneous
Bookmark this page for easy reference. Let me know how it works out for you!