How can I make my CSS code compatible with all browsers?
cross-browser, css, html
Solution
Your CSS should work in all browsers as is. It may not display the same from browser to browser. Most developers use a reset to fix that issue.
CSS RESET
http://meyerweb.com/eric/tools/css/reset/
or
NORMALIZE
http://necolas.github.com/normalize.css/
Problem
``` p { margin:0;padding:0; } p#error { color:#FF0000; text-align:center; } p#success { color:#3983C2; text-align:center; } div#nav { background-image:url('../img/nav.png'); background-repeat:no-repeat; padding-top:5px; padding-bottom:5px; } div#nav, a { text-decoration:none; } body { margin:0 auto; width:600px; } div#login, div#register { background-image:url('../img/form.png'); background-repeat:repeat-y; padding-top:5px; padding-bottom:5px; } div#login table, div#register table { margin:0 auto; } div#login table td, div#register table td { text-align:right; } div#login input#btn, div#register input#btn { background-image:url('../img/btn.png'); border-style:none; width:70px;height:25px; } div#footer { background-image:url('../img/footer.png'); height:30px; } ``` Here is my CSS code. I don't know how to make this CSS work in other browsers, currently I'm working in Chrome. I already searched the net and found many pages with related information, but these are even more difficult for me to understand. Need your suggestions or etc. Thank you very much!