I cant figure out why IE won’t display my navigation links. I’m assuming its something to do with my CSS.Modern browsers have no problem spitting out what you would expect. I’ve validated- no clues to be had there.
I was hoping someone with fresh eyes would be kind enough to give it a look over. If theres anything that I could do to help you help me, let me know. Thanks in advance.
Link to site:
[url]http://www.austinlowery.limewebs.com
link to CSS source:
[url]http://austinlowery.limewebs.com/style2.css
Targeted Snippets:
HTML that is not displaying
[CODE]<nav class=”main”>
<a href=”index.html” class=”home”><span class=”invisible”>Home</span></a>
<a href=”blog.html” class=”blog”><span class=”invisible”>Blog</span></a>
<a href=”about.html” class=”about”><span class=”invisible”>About</span></a>
<a href=”web_design.html” class=”web_design”><span class=”invisible”>Web Design</span></a>
</nav>
Related CSS
[CODE]
.invisible{
visibility:hidden;
}
.main{
top:50%;
margin-top:-16px;
display:block;
left:50%;
margin-left:-293px;
z-index:6;
}
.main a{
display:inline-block;
height:31px;
background-image:url(links.png);
text-decoration:none;
margin:0px 25px 0px 25px;
top:-7px;
z-index:7;
}
.home{
background-position: 0px 0px;
width:78px;
}.home:hover{background-position: -78px 0px;}
.blog{
background-position: -306px 0px;
width:66px;
}.blog:hover{background-position: -372px 0px;}
.about{
background-position: -156px 0px;
width:75px;
}.about:hover{background-position: -231px 0px;}
.web_design{
background-position: -438px 0px;
width:155px;
}.web_design:hover{background-position: -593px 0px;}