Validate Your CSS
- by Gareth Williams
CSS code is notoriously difficult to debug. Sometimes it is impossible to see if changing a bit of CSS code has made any difference at all to the layout of a page. Furthermore, for all your efforts your CSS layout may look completely different in other web browsers.
CSS is not a perfected art, nor is it a particularly reliable method of laying out a web page - certain browsers implement only certain versions of the CSS specification, and even then not all of the spec is necessarily included. Notable omissions such as max- and min- width and height in Internet Explorer 6, and discrepancies between browsers such as where borders are applied relative to padding and margins, are the cause of many headaches each and every day for web designers.
In general, the first step you should take when attempting to debug a CSS is to run it through a 'validator', such as that found at http://jigsaw.w3.org/css-validator/. It will highlight errors in your code and warn you of any potential issues with your layout - something that you just can't get from debugging CSS in a web browser.
By validating your CSS and ensuring that it meets the CSS specification you can ease the debugging process and future-proof your design against redundant CSS code.