Mystery text rendering issue - all browsers on Macs

[palatinate11]

I've been scratching my head for a while over this one. I'd appreciate any help or suggestions anyone can provide.

I designed this site on a PC and have only just got back to my Mac for testing. It looks fine on all browsers on the PC but on the Mac there's the weirdest text rendering thing going on in my top nav bar.

Check it out: http://www.alicewinthrop.com look closely at the bottom of the top nav bar text elements - when you refresh the page it looks clear and then they start to grow as if you had just written on absorbent paper with an inky pen.

I've tried all kinds of adjustments and google searches - I have a sneaking suspicion that I am missing something obvious but I am too close to it now to figure out what that might be.

Can anyone identify the problem/a fix? Thanks in advance for your help.

Alice


Here's the CSS for the top nav bar:

/* Navbar items */
#topnavlist li {
margin: 0;
padding: 0;
float: left;
width: 90px;
height: 26px;
display: inline;
line-height: 26px;
}

#topnavlist a {
padding: 0;
margin: 0;
text-decoration: none;
background: url(images/greengrad.gif) no-repeat;
float: left;
width: 90px;
height: 26px;
display: block;
text-align: center;
}

#topnavlist a:link {
color: #68926d;
}

#topnavlist a:visited {
color: #68926d;
}

#topnavlist a:hover {
color: #ffffff;
background: url(images/green.gif) no-repeat;
}

#topnavlist a:active {
color: #ffffff;
}

#topnavlist a.current {
color: #ffffff;
background: url(images/green.gif) no-repeat;
}

#topnavlist a:visited.current {
color: #ffffff;
}


and the XHTML:

<!-- nav bar items-->
<div id="topnavlist">
<ul>
<li><a class="current" href="index.php" accesskey="h">home</a></li>
<li><a href="portfolio.php" accesskey="p">portfolio</a></li>
<li><a href="resume.php" accesskey="r">resume</a></li>

<li><a href="contact.php" accesskey="c">contact</a></li>
<li><a href="http://www.alicewinthrop.com/myphotos/main.php" accesskey="m">myphotos</a></li>
<li><a href="http://www.alicewinthrop.com/mynews/mynews.php" accesskey="n">mynews</a></li>
<li><a href="links.php" accesskey="l">links</a></li>
</ul>
<!-- extra 8px green gradient to fill out nav bar -->
<img class="navpad" src="./includes/images/eightpx.gif" width="8" height="26" alt="navpad" /></div>

[kyleposey]

try it on someone elses mac. That seems more like a mac rendering bug than a browser issue.

[Louis]

Here's a capture from Firefox on my Mac.

I don't see anything wrong.

[palatinate11]

Thanks for that feedback - it must just be some kind of local problem.

I do have some work to do yet on the IE5 for Mac stylesheet though!

Much appreciated, thanks.