Nuts
05-22-2008, 05:35 AM
Hi Again! I have looked through the archives and although I can find questions related to this topic, I couldn't find a solution.
The borders around the images are different in IE and FF. These are links and the links are specified in the css. FF seems to be working correctly but IE just shows the standard blue.
Here's the css.
.pagination{
width: 330px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
text-align: center;
background-color: #888C8F;
padding: 5px 10px;
}
.pagination a{
padding: 0 5px;
text-decoration: none;
color: #00007D;
background: #888C8F;
}
.pagination a:hover, .pagination a.selected{
color: #cccccc;
background-color: #888C8F6;
}
And the code in the page:
<div id="paginate-slider2" class="pagination">
<div align="center"><a href="#" class="toc" style="margin-right 10px"><img src="../images/pic1.jpg" width="75" height="50" hspace="10" vspace="10" /></a><a href="#" class="toc anotherclass" style="margin-right 15px"><img src="../images/pic2.jpg" width="75" height="50" hspace="10" vspace="10" /></a><a href="#" class="toc" style="margin-right 10px margin-left 10px"><img src="../images/pic3.jpg" width="75" height="50" hspace="10" vspace="10" /></a></div>
</div>
I do have another css linked to the page, so wonder if this is causing the problem. This has the followin a: information in it.
a {
font: 80% Helvetica, Verdana, Arial, sans-serif;
background: #ffffff;
color: #439940;
text-decoration:none;
}
a:hover
{
font: 80% Helvetica, Verdana, Arial, sans-serif;
background: #ffffff;
color: #3F3F3F;
text-decoration:none;
Link to the test page here ("")
}
Thank you in advance to anyone who can shed light on this! Nuts
The borders around the images are different in IE and FF. These are links and the links are specified in the css. FF seems to be working correctly but IE just shows the standard blue.
Here's the css.
.pagination{
width: 330px; /*Width of pagination DIV. Total width should equal slider's outer width (400+10+10=420)*/
text-align: center;
background-color: #888C8F;
padding: 5px 10px;
}
.pagination a{
padding: 0 5px;
text-decoration: none;
color: #00007D;
background: #888C8F;
}
.pagination a:hover, .pagination a.selected{
color: #cccccc;
background-color: #888C8F6;
}
And the code in the page:
<div id="paginate-slider2" class="pagination">
<div align="center"><a href="#" class="toc" style="margin-right 10px"><img src="../images/pic1.jpg" width="75" height="50" hspace="10" vspace="10" /></a><a href="#" class="toc anotherclass" style="margin-right 15px"><img src="../images/pic2.jpg" width="75" height="50" hspace="10" vspace="10" /></a><a href="#" class="toc" style="margin-right 10px margin-left 10px"><img src="../images/pic3.jpg" width="75" height="50" hspace="10" vspace="10" /></a></div>
</div>
I do have another css linked to the page, so wonder if this is causing the problem. This has the followin a: information in it.
a {
font: 80% Helvetica, Verdana, Arial, sans-serif;
background: #ffffff;
color: #439940;
text-decoration:none;
}
a:hover
{
font: 80% Helvetica, Verdana, Arial, sans-serif;
background: #ffffff;
color: #3F3F3F;
text-decoration:none;
Link to the test page here ("")
}
Thank you in advance to anyone who can shed light on this! Nuts