[RESOLVED] Unwanted spacing between images

[admin]

Hi I am getting spacing in between images that I do not want and I cant see how they are appearing. <br />
<br />
My code for the images is:<br />
<br />
<div id="nav"><img src=http://www.webdeveloper.com/forum/archive/index.php/"img/trans.gif" width="336" height="4" /><br />
<A HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutR()" onmouseout="SwapBackR()"><img src="img/resume.jpg" name="Resume" border="0" width="110" height="47" /></a><br />
<A HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutG()" onmouseout="SwapBackG()"><img src="img/gallery.jpg" name="Gallery" border="0" width="109" height="47" /></a><br />
<A HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutC()" onmouseout="SwapBackC()"><img src="img/contact.jpg" name="Contact" border="0" width="110" height="47" /></a><br />
</div><br />
<br />
I have attached a screen shot to show what is happening. It is happening in IE and Firefox. Any ideas?<br />
<br />
Cheers!<!--content-->By default, images are in-line elements. Line breaks in HTML within a block-level element are treated as word spaces. My recommended solution would be to add this to your CSS:<br />
<br />
#nav img {<br />
float: left;<br />
}<br />
<br />
Alternatively, you could just put your line-breaks within the A or IMG tags, as the line break will not be interpreted as a word space there:<br />
<br />
<div id="nav"><img src=http://www.webdeveloper.com/forum/archive/index.php/"img/trans.gif" width="336" height="4" /><A <br />
HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutR()" onmouseout="SwapBackR()"><img <br />
src=http://www.webdeveloper.com/forum/archive/index.php/"img/resume.jpg" name="Resume" border="0" width="110" <br />
height="47" /></a><A HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutG()" <br />
onmouseout="SwapBackG()"><img src=http://www.webdeveloper.com/forum/archive/index.php/"img/gallery.jpg" name="Gallery" border="0" <br />
width="109" height="47" /></a><A HREF=http://www.webdeveloper.com/forum/archive/index.php/"#" onmouseover="SwapOutC()" <br />
onmouseout="SwapBackC()"><img src=http://www.webdeveloper.com/forum/archive/index.php/"img/contact.jpg" name="Contact" border="0" <br />
width="110" height="47" /></a><br />
</div><br />
<br />
PS: I note that you are use XHTML " />" stand-alone tag closures, but you have some upper-case tag and attribute names, which are not XHTML compliant (they should always be lower-case in XHTML).<!--content-->I see, I see thanks for that bro lovely stuff<!--content-->