html - Css-sprite menu not working in ie -
Why does Internet Explorer present this CSS sprite menu? Can someone leave some light for me because I have not received any error in the code. HTML:
& lt; Div class = "menu" & gt; & Lt; Ul class = "nav" & gt; & Lt; Li class = "home" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 2" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 3" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 4" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 5" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 6" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "element 7" & gt; & Lt; A href = "#" & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt;
CSS for wrappers and links:
.menu {height: 350px; Margin: 0; Padding: 0; Swim left; Width: 150px; } / * Menu * / .nav {background: url ("menusprite.png"); Height: 350px; Padding: 0; Margin: 0; } .nav li {list-style: none; Padding: 0; Status: Relative; Top: 0; }. Nav li, .nav a {height: 50px; Display area; }
and for example CSS: link and: hover:
.home {left: 0; Height: 50px; } .home A: hover {background: url ("menusprite.png") - 150px 0 no-repeat;
Your CSS should look even more:
< Code> .Home A: Hover {Background: Transparent URL ("Men's Light Page") No-Encore Scroll -150px 0; }
Two things in your CSS were incorrect:
- url (...) - 150px : you
- -150px 0 no-repeat : Background-repeat (and background-attachment) should come in shorthand before background location
Comments
Post a Comment