Need help with a coding error

I have a piece of code in the header of a site that loads an image with a default link back to the homepage.

this is the code:

<div align="justify"><a href="index.php" class="nounder">
<img id="logo" border="0" ></a> </div>

The image code is in the css file like this:

#header #logo {
position: absolute;
left: 15px;
top: 0px;
width: 400px;
height: 75px;
background: url(../images/light_slate/logo.png) 0 0 no-repeat;
}

The problem is when the image loads it also creates another box on top of the image. see here http://tiny.cc/LZXZb

Anyone know how to alter the code to get rid of that extra overlaying box??

Thanks in advance.

 

i think you should edit the following bold line... (remove the code)

<div align="justify"><a href="index.php" class="nounder">
<img id="logo" border="0" ></a> </div>

hope it helps...

 

You have WAY too much code for that site in your markup. The first thing I'd do is stop catering to Quirks Mode by removing the empty line above the DOCTYPE declaration. Then from there I'd rewrite the site entirely to use less code (I'm figuring you might be able to reduce the page file xize by upwards of 75% here - I'm NOT kidding).

Now, I checked this out in Opera but it looks fine. What browser are you having this problem in?

 

Its looking good in Firefox as well so i assume it just an Internet Explorer issue. any idea on a fix?

 

<img id="logo" border="0" >

Code (markup):

That is not valid HTML. You need to include the image src path. That's probably what's causing the problem.

 

Did i said something more confusing... which was not clear ??? to resolve the error ?

please help me understand if something was not clear so i will make a correction from next time in my explanation