How to figure out the CSS bugs?

I have stupid question, sometime you just go on and design something and do all CSS and just check it out in your fav browser but BANG! you see the stuff is not good in other browser specialy IE what is the best strategy to find them out ? Where is the be开发者_StackOverflowst to start ?

The best place to start is here. This will at least verify that you don't have syntax errors in your CSS files and that they conform to some level (CSS 1, CSS 2, CSS 2.1, CSS 3, ...). As far as the different behavior between browsers is concerned, there's no magic, otherwise web design would have been an easy job :-)

First step use a reset stylesheet because different browsers render differently the html elements (even more internet explorer that had bad relation with web standars).

Secondly validate your css files at http://jigsaw.w3.org/css-validator/

Also you can use firebug (plugin for firefox) and all other built-in developer tools for developers of each browser (internet explorer,chrome,opera support these futures). In this way when a browser show differently an element than another you can debug (removing or adding the css rules) and fix the error using a cross browser method or adding a rule specific for this browser using a css hack (not best practice, but sometimes they are useful).