...

View Full Version : CSS Issues on TopLinks



lazouche
10-28-2009, 05:23 AM
Hello,

We are having an issue on our CSS. Basically when we Zoom out or in with IE, all the links appear one on top of each other and being a bit off but completely horrible. in Firefox it does not do this, it zooms fine

HTML is:

<table border="0" cellpadding="0" cellspacing="0" id="headerTopLinks">
<tr>
<td><img src="https://www.xxxxxx.com/images/home.gif" /><a href="http://www.xxxxxx.com">Home</a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/question.gif" /><a href="http://www.xxxxxx.com/about">About Us</a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/one.gif" /><a href="http://www.xxxxxx.com/advantage">Why Choose </a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/news.gif" /><a href="http://www.xxxxxx.com/blog">News</a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/person.gif" width="9" height="10" /><a href="http://forums.xxxxxx.com/">Forums</a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/dollar.gif" width="9" height="10" /><a href="http://www.xxxxxx.com/affiliates">Affiliates</a><span class="TopLinksBars">|</span><img src="https://www.xxxxxx.com/images/lock.gif" width="9" height="10" /><a href="http://www.xxxxxx.com/login">Customer Login</a></td>
</tr>
</table>

CSSs:

#headerTopLinks {
width: 625px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: auto;
height: 30px;
background-color: #4A75B5;
color: #425D84;
border-right-width: 3px;
border-bottom-width: 3px;
border-left-width: 3px;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-color: #3e5c80;
border-bottom-color: #3e5c80;
border-left-color: #3e5c80;
padding: 0px;
text-align: center;
}

#headerTopLinks a {
text-decoration: none;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
display: inline;
font-size: 11px;
margin-right: 5px;
margin-left: 5px;
}

#headerTopLinks td {
vertical-align: baseline;

}

.TopLinksBars {
font-size: 18px;
margin-right: 5px;
}

Can someone please help us with this?

Thank You

technica
10-28-2009, 07:50 AM
Try giving width of the headerTopLinksin to percentage rather than giving fixed width



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum