css: image rollovers stumps IE
I'm currently coding a webpage which is not finished. There is one thing that really has stumped me. I created the image rollover effect with css which works perfectly on Mozilla .9.3 but has problematic problems with Internet Explorer 6. In IE it continously loads the pics and even when it stops it never shows up!?!::: IE has to definately work because of the situation of it being used at school and by people who never even heard of Mozilla and the such. Also Javascript is also definately out of the question cause of the schools and other students/teachers problems with other school related sites that have it!
Here is the main site code so far:
Code:
<html>
<head>
<title>   Open G-source   </title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="links.css">
</head>
<body>
<table width="900" align="center" border="0" bordercolor="white">
<tr>
<td>
<!--begin content-->
<table width="890" valign="top" align="center">
<tr>
<td><img src="header.png"><br><br><br><br>
<center>
<a href="dis.html" class="dis"></a>
<a href="about.html" class="about"></a>
<a href="sections.html" class="sec" target="linki"></a>
</center>
</td>
</tr>
<tr><td>
<iframe src="dumb.html" name="linki" width="500" height="25" frameborder="0">
</td></tr>
</table>
</table>
<!--end content-->
</td>
</tr>
</table>
</body>
</html>
And here is the css code for the rollover:::
Code:
a.dis {
text-decoration: none;
background-repeat: no-repeat;
background-position: left top;
padding-left: 200px;
padding-top: 40px;
}
a.dis:link {
background-image: url(dis.png)
}
a.dis:visited {
background-image: url(dis.png)
}
a.dis:hover {
background-image: url(blank.png)
}
a.dis:active {
background-image: url(dis.png)
}
a.about {
text-decoration: none;
background-repeat: no-repeat;
background-position: left top;
padding-left: 200px;
padding-top: 40px;
}
a.about:link {
background-image: url(about.png)
}
a.about:visited {
background-image: url(about.png)
}
a.about:hover {
background-image: url(blank.png)
}
a.about:active {
background-image: url(about.png)
}
a.sec {
text-decoration: none;
background-repeat: no-repeat;
background-position: left top;
padding-left: 200px;
padding-top: 40px;
}
a.sec:link {
background-image: url(sec.png)
}
a.sec:visited {
background-image: url(sec.png)
}
a.sec:hover {
background-image: url(blank.png)
}
a.sec:active {
background-image: url(sec.png)
}
Is it some new security with sp2 or is it my code or even IE itself? Ahh. the pic below is how its supposed to look so far with mozilla and the IE pic, just imagin white screen. Thanz.
