Image Border Problems

[Cerebral Believer]

Hi folks,

Anyone know why I see a double border around my images (in Netscape &
Firefox) that use the following code:

HTML:

<td class="valtop" width="1%">
<a class="lisbut" onmouseover="document.getElementById('trk2m').src =
'../../images/listenbuy/mp3_mo.jpg';"
onmouseout="document.getElementById('trk2m').src =
'../../images/listenbuy/mp3.jpg';"
type="audio/x-mpegurl"
href="../../musdir/001Rs/There%20Is%20Still%20Hope.m3u">
<img class="lisbut" id='trk2m' src="../../images/listenbuy/mp3.jpg"
alt="There Is Still Hope (.mp3)"/></a>
<br/>
<a type="audio/x-mpegurl" title="Listen to the .mp3 sample of this track"
href="../../musdir/001Rs/There%20Is%20Still%20Hope.m3u">mp3</a>
<br/></td>

CSS:

..valtop {
vertical-align: top;
text-align: center;
line-height: 40%;
}
..lisbut {
border: 1.5px solid #000000;
}

When I view the pages including this code and referencing the styles cited,
the borders don't appear wrapped tight to the edge of the pictures, and it
looks a mess. Any know how to remedy this?

Regards,
C.B.

 

[BootNic]

[email protected]
Hi folks,

Anyone know why I see a double border around my images (in Netscape &
Firefox) that use the following code:

That would be the result of giving the img a border as well as its parentNode.

<td class="valtop" width="1%">
<a class="lisbut" [snip]
<img class="lisbut" [snip]
.lisbut {
border: 1.5px solid #000000;
}

When I view the pages including this code and referencing the styles
cited, the borders don't appear wrapped tight to the edge of the
pictures, and it looks a mess. Any know how to remedy this?

Remove the class from the img parentNode.