开发者

css nav ul not working

I made a new website and my problem is that the menu is ok in FF and other browsers, but not in IE.

The problem is, it wont list the list elements, no hover , no color, and not inline.

here is the code

nav {
    margin-top: 15px;
}

nav ul {
    position: relative;
    left: 297px;

}

nav li  {
    float: left;
    padding: 0 20px;
    font-size: 12px;
    line-height: 65px;
    background: url(images/line.png) no-repeat right 10px;
   开发者_JS百科 height: 72px;
    text-transform: uppercase;

} 

nav li a {
    color: #656464;
    text-decoration: none;
    display: block;
}

nav li:hover {
    background: url(images/hover.png) repeat-x 0 35px;
    color: #242424;
}

could please someone could give me a hint?


nav is an HTML5 element; old IEs will not recognize it and thus won't apply your styles.

To make IE recognize HTML5 markup, place the HTML5 shiv on your page, then declare a rule for nav and any other HTML5 elements you use, giving them a display: block style, just above the CSS that you have now.


<nav> is fine to use on a page, but you will run into problems with it when you try and style it as many browsers simply skip the tag if they don't understand it.

Wrap the <nav> tag in a wrapper div and style that instead, and strip away any styling from the semantic tags so they are naked.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜