Bad CSS Practices To Avoid
Use CSS Reset
Always use normalize.css or the Bootstrap CSS before your custom styles to reset the code to avoid browser inconsistencies defining all default styles.
Group The Elements From Top To Bottom
Try to build your stylesheet grouping page sections, beginning with body styles, and going on with header, nav, article and footer. Always group ids and classes that fall under the same element and use comments/annotations to identify a set of code. It's recommended to name your elements properly based on their use instead of their properties such as what color or font type the element has.
/***** General *****/ html {...} body {...} h1, h2, h3 {..} p {...} a {...} a:hover {...} /***** Header *****/ #header {...} /***** Navigation *****/ #nav {...} /****** Footer *****/ #footer {...}
Useful Tips
Use hex codes instead of color names.
Use browser prefixes for experimental or nonstandard CSS properties:
- -webkit- Chrome, newer versions of Opera.)
- -moz- (Firefox)
- -o- (Old versions of Opera)
- -ms- (Internet Explorer)
Validate your CSS to make sure you didn't commit one of the crimes listed above.