Rogue pixels

trying to put images together, total pixels adds up to too much

[gotimmy]

Hi helpful people :)

Been forced ito sticking some ads uder a page,.
The exisiting page is in a 800px container.
I've got 3 ads - 2 of 200px, one of 400px = 800px by my reckoning.
I'm getting some kind of border on them which is breaking the layout, and I ca't work out where. The html after the main layout is:

<div class="ads">
<a href="http://blah blah blah" target="blank"><img src="blah blah blah" width="200" height="55" alt="blah blah blah" /></a>
<a href="http://blah blah blah" target="blank"><img src="blah blah blah" width="200" height="55" alt="blah blah blah" /></a>
<a href="blah blah blah"><img src="blah blah blah" width="400" height="55" alt="blah blah blah" /></a>
</div>

with the CSS being:

.ads {
width: 800px;
height: 55px;
margin: 0;
border: 0;
padding: 0;
}

.ads a {
text-decoration: none;
margin: 0;
border: 0;
padding: 0;
}

Any idea why I'm still getting some kid of border around the images?

Thanks in advance :)

[john_k]

The line break following the </a> will be rendered as a space. Just put all three images and links on the same line with no breaks between them.

[Robin_reala]

Or add this to your CSS:

.ads a { display: block; }

[gotimmy]

Many thanks for the replies.

john_k - the linebreaks were just from posting to the forum.

Robin_reala - that stacked the images one under the other istead of side-by-side like I was aiming for.

I added 'float: left;' to the 'ads a' part of the css, and now it's looking great on Safari. But I'm still getting a border round the images in Firefox. Can anyone tell me how to stop that?

Thanks in advance,

Tim

[createErrorMsg]

I'm still getting a border round the images in Firefox. Can anyone tell me how to stop that?

.ads a img{border:0;}

[gotimmy]

Thanks!