CSS bold is CSS "SUPER BOLD" in mac

[freelance84]

Ok a few days ago i had an issue (http://www.phpfreaks.com/forums/index.php/topic,310561.0.html) with text being rendered in bold only on macs.

I seem to have resolved this issue mostly by reducing the general font size through my site. It's starting to look a lot better. Only i cant get certain bits to the way they look on a pc.

 

The bits of text in question are links in my header and footer. The header has a blue gradient repeat-x as the background and all text ontop of it is in white bold. I like the look on a pc, but when a mac opens the page the bold becomes super bold.

 

Below is all the CSS which effects the header:

html, body {
height: 100%;
font-family: verdana;
font-weight: normal;
font-size: 10pt;
}
#header {
width: 700px;
height: 62px;
margin-right:auto;
margin-left:auto;
background-image: url(png/top-gradient.png);
background-repeat: repeat-x;
position: relative;
}
#header-inner{
float: right;
width: 400px;
font-weight: bold;
color: #FFFFFF;
text-align: right;
padding-right: 15px;
padding-top: 5px;
vertical-align: middle;
}
A:link {
text-decoration: none;
color: #FFFFFF;
}
A:visited {
text-decoration: none;
color: #FFFFFF;
}
A:active {
text-decoration: none;
color: #FF6600;
}
A:hover {
color: red;
text-decoration: none;
}

 

 

And bloew here is the html for the header.

<div id="header">
   <span id="header-inner">
      Logged in as: john -<br/>
      <a href="accountDetails.php">Account Details -</a><br/>
      <a href="logout.php">Log Out</a> -
   </span>
   <a href="http://www.mysite.net"><img style="padding-left:5px;padding-top:2px;" src="png/logo.png" alt="logo" /></a>
</div>

 

Should i be using a different font to be able to use bold but keeping it looking the same on moth pc's and macs?

[Colton.Wagner]

I don't really know if this will help you but it's worth a shot. Check out the link I provided below.

 

http://www.w3schools.com/Css/pr_font_weight.asp

 

I hope I could be of some assistance.

Thanks,

Colton Wagner