How can I make my CSS code compatible with all bro

2020-03-04 08:26发布

问题:

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 7 years ago.
 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!

回答1:

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/



回答2:

The problem is that each browser adds different default margins, padding, etc., to different items. This means that you get slightly, or greatly, different layouts in each.

I like to do a CSS rest like this:

*{margin:0; padding:0}


回答3:

IE(worst enemy): http://css-tricks.com/how-to-create-an-ie-only-stylesheet/
Firefox: http://css-tricks.com/snippets/css/css-hacks-targeting-firefox/
Opera: How to make CSS visible only for Opera