简体   繁体   中英

why css tabs look different in ie and firefox

i have created some tabs using css but they look horrible in ie 7. Why? Here is the html

<ul>
    <li><a href='view.php'>View</a><li>
    <li><a href='logout.php'>Logout</a><li>
    <li><a href='www.google.com'>Search</a><li>
</ul>

and here is the css

ul{list-style:none;height:20px;}
li{background-color:#ff0;float:left;margin:5px;width:60px;text-align:center;display:block;}
li:hover{background-color:#009;}
a{text-decoration:none;}

Here is how it looks in ff

在ff中出现

Here is how it looks in ie 在此处输入图片说明

You're not terminating your list items correctly. Try replacing each <li> at the end of the lines with </li> and you should be good.

Have you tried a reset CSS like :

http://meyerweb.com/eric/tools/css/reset/

It could be appreciable...

Edit

@Kaivosukeltaja is right :

<li>...</li>

Will fix your problem. But you can let the CSS reset on your page ;)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM