my footer is too large in IE6!

[ssbeats]

Hi.

http://synthsoundz.com/devonwebsitedesign/

Can someone please sugguest why my footer is much larger on IE6?

Your help would be greatly appreciated.

[Fang]

#footer
{position:relative;
width:890px;
height:74px;
clear:both;
border-top:1px white solid;
margin:auto;
padding-left:10px;
font-size:9px;
background:url(../images/blue-style/bg-bottom.gif) no-repeat bottom;
}
#footer p
{
margin-top:20px;
}

#w3c-icons
{
position:absolute;
top:25px;
left:700px;
}
#w3c-icons img {vertical-align:bottom;}
<div id="footer">
<p>
www.devonwebsitedesign.com | <a href="#links">links</a>
</p>

<div id="w3c-icons">
<a href="http://validator.w3.org/check?uri=referer"><img style="border: 0pt none ; width: 88px; height: 31px;" src="Document_files/valid-xhtml10-blue.png" alt="Valid XHTML 1.0 Strict"></a>
<a href="http://jigsaw.w3.org/css-validator/"><img style="border: 0pt none ; width: 88px; height: 31px;" src="Document_files/vcss.gif" alt="Valid CSS!"></a>
</div>

</div>

</div>


</body></html>

[ssbeats]

Hi thanks.
Your sugguestion got me on the right track.

I couldn't add the footer image as a background image as the repeating center image (gradient) would show up behind it. So i used your css only i kept the html as it was and removed the background image from the stylesheet. Also i didnt need the #w3c-icons img {vertical-align:bottom;} code for some reason.

Anyway it works and looks good in FF/IE6+7 and safari so thanks for your help.

I have just one more issue (i hope). In IE7 when you click on one of the nav links at the top they turn black.

I used jquery to slightly fade out all links except for the link which was active. I should probably post this in a jquery or dhtml forum but here is the code anyway...

// JavaScript Document
$(document).ready(function(){

$("#tabs a").click(function(){
$("#tabs a").fadeTo(1, 0.5);
$(this).fadeTo(1, 1.0);

});
});


Can anyone sugguest why the links turn black??

Thanks.

[Fang]

A possibility is the use of color transparent(not fully supported in IE) in jQuery's fadeTo function.

There is a recommendation to use all non-informative images as a background. That would imply only using the site name image in the html, the others ought to be in the css.

Incorrect grammar in the left panel, correct in the right!How do i edit/update/maintain my website after it has been built?

[ssbeats]

ok thanks.

So bascially the fadeTo() function uses a transparent method not well supported by IE.

In this case i have commented out the jquery script using jquery so its only avaliable to browsers other than IE. Shame though.

cheers for the typo anyway. In fact i was going to make a post on this forum to ask some general sugguestions and criticisms regarding the content and the site.

Thanks again Fang.

[Fang]

I wouldn't guarantee the transparent color is the problem.
If it is then it's a bug in jQuery. Best ask in the jQuery forum.