CSS navigation not working in IE for Mac

Perseus

Perseus

Registered
Here is my CSS:
a:link {
font-family: Verdana, serif;
color: white;
text-decoration: none;
}
a:visited {
font-family: Verdana, serif;
color: white;
text-decoration: none;
}
a:hover {
font-family: Verdana, serif;
color: white;
text-decoration: underline;
}
a:active {
font-family: Verdana, serif;
color: #859234;
text-decoration: none;
}

#navigation ul {
list-style: none;
padding: 0px;
position: absolute;
left: 60px;
top: 97px;
padding: 0px;
margin: 0px;
}


And my HTML:

<div id="navigation">
<ul>
<li><a href="index.html">home</a>&nbsp; <a href="portfolio.html">portfolio</a>&nbsp; <a href="services.html">services</a>&nbsp; <a href="contact.html">contact</a></li>
</ul>
</div>

This works in every browser except IE for Mac...any ideas? I would like this fixed ASAP :)
 
Do you really have a list with just one <li> element? That's odd ...

What exactly is not working? Is the style applied wrongly? Can't you click the links? Is the position wrong?

I do suppose you have a dark background, otherwise the white links won't really show up that much ...
 
Yeah, I have a dark background. The underline part of hover never works, and they don't act as links, they act as flat text. I guess I was using only one li, I had other stuff in there but got rid of it.
 
Everything's fine here. The following testpage displayed correctly. Although I would design it differently, the code works: underlined appear onhover and the links are all clickable, in Safari as well as in IE/Mac,

<html>
<head>

<style>
<!--
body {background: black;}
a:link {
font-family: Verdana, serif;
color: white;
text-decoration: none;
}
a:visited {
font-family: Verdana, serif;
color: white;
text-decoration: none;
}
a:hover {
font-family: Verdana, serif;
color: white;
text-decoration: underline;
}
a:active {
font-family: Verdana, serif;
color: #859234;
text-decoration: none;
}


#navigation ul {
list-style: none;
padding: 0px;
position: absolute;
left: 60px;
top: 97px;
padding: 0px;
margin: 0px;
}
-->
</style>

</head>

<body>
<div id="navigation">
<ul>
<li><a href="index.html">home</a>&nbsp; <a href="portfolio.html">portfolio</a>&nbsp; <a href="services.html">services</a>&nbsp; <a href="contact.html">contact</a></li>
</ul>
</div>

</body>
</html>
 
I figured out my issue...somehow "Show style sheets" under IE's preferences was unchecked. How it got that way, I'm not really sure. Very, very weird.

It seems to work the same in Safari and IE now. Perseus, maybe something you removed was causing the issue. You might want to look and see if there are any unenclosed tags or other errors like that in the code.
 
You must log in or register to reply here.
Back
Top