Firefox displaying table borders weirdly

[jackvull]

Any ideas on why Firefox displays just a partial line for the border in this code below (IE is fine):

<table valign = 'center' id = 'audiomixes' cellpadding='2' STYLE='position:absolute;top:168;

left:350; ' border='0' rules='rows' frame='box' >

<tr>
<td colspan = '2' style='border-left:solid 2px #060; border-top:solid 2px #060;'><b>House

Mix</b></td>
<td colspan = '2' style='border-left:solid 2px #060; border-top:solid 2px #060;'><b>Deep

House Shake</b></td>
<td colspan = '2' style='border-left:solid 2px #060; border-top:solid 2px #060;

border-right:solid 2px #060;'><b>Luv_Muzik</b></td>
</tr>

<tr>
<td colspan = '2' style='border-bottom:solid 2px #060; border-left:solid 2px #060;'> <a

class = 'gallery' target = '_blank' href='mixfeedback.php?num=3'>View/add feedback (2)</a>

</td>
<td colspan = '2' style='border-bottom:solid 2px #060; border-left:solid 2px #060;'> <a

class = 'gallery' target = '_blank' href='mixfeedback.php?num=10'>View/add feedback (2)</a>

</td>
<td colspan = '2' style='border-bottom:solid 2px #060; border-left:solid 2px #060;

border-right:solid 2px #060;'> <a class = 'gallery' target = '_blank'

href='mixfeedback.php?num=11'>View/add feedback (3)</a> </td>
</tr>

<tr>
<td style='border-left:solid 2px #060; border-bottom:solid 2px #060;'><img

src='./MixImages/3_01.jpg'></td>
<td style='border-bottom:solid 2px #060;'> <a class = 'main'

href='download.php?filename=j_hazzrd.ram&type=mix' target = 'iframedownload'><br />RM

Stream</a> <a class = 'main' href='download.php?filename=j_hazzrd.rm&type=mix' target =

'iframedownload'><br />RM Download</a></td>
<td style='border-left:solid 2px #060; border-bottom:solid 2px #060;'><img

src='./MixImages/3_02.jpg'></td>
<td style='border-bottom:solid 2px #060;'> <a class = 'main'

href='download.php?filename=DeepHouseShake.mp3&type=mix' target = 'iframedownload'><br />MP3

Stream</a> <a class = 'main' href='download.php?filename=DeepHouseShake.mp3&type=mix' target

= 'iframedownload'><br />MP3 Download</a></td>
<td style='border-left:solid 2px #060; border-bottom:solid 2px #060;'><img

src='./MixImages/3_03.jpg'></td>
<td style='border-bottom:solid 2px #060; border-right:solid 2px #060;'> <a class = 'main'

href='download.php?filename=Luv_Muzik_JHazzrd.mp3&type=mix' target = 'iframedownload'><br

/>MP3 Stream</a> <a class = 'main'

href='download.php?filename=Luv_Muzik_JHazzrd.mp3&type=mix' target = 'iframedownload'><br

/>MP3 Download</a></td>
</tr>

<tr>
<td colspan = '2' style='border-left:solid 2px #060; border-top:solid 2px #060;'><b>Deep

Sunrise</b></td>
<td colspan = '2' style='border-left:solid 2px #060; border-top:solid 2px #060;

border-right:solid 2px #060;'><b>Dilthy Birty Feats</b></td>

</tr>

<tr>
<td colspan = '2' style='border-bottom:solid 2px #060; border-left:solid 2px #060;'> <a

class = 'gallery' target = '_blank' href='mixfeedback.php?num=12'>View/add feedback (6)</a>

</td>
<td colspan = '2' style='border-bottom:solid 2px #060; border-left:solid 2px #060;

border-right:solid 2px #060;'> <a class = 'gallery' target = '_blank'

href='mixfeedback.php?num=13'>View/add feedback (11)</a> </td>

</tr>

<tr>
<td style='border-left:solid 2px #060; border-bottom:solid 2px #060;'><img

src='./MixImages/3_04.jpg'></td>
<td style='border-bottom:solid 2px #060;'> <a class = 'main'

href='download.php?filename=DeepSunrise.mp3&type=mix' target = 'iframedownload'><br />MP3

Stream</a> <a class = 'main' href='download.php?filename=DeepSunrise.mp3&type=mix' target =

'iframedownload'><br />MP3 Download</a></td>
<td style='border-left:solid 2px #060; border-bottom:solid 2px #060;'><img

src='./MixImages/3_05.jpg'></td>
<td style='border-bottom:solid 2px #060; border-right:solid 2px #060;'> <a class = 'main'

href='download.php?filename=Dilthy_Birty_Feats.mp3&type=mix' target = 'iframedownload'><br

/>MP3 Stream</a> <a class = 'main'

href='download.php?filename=Dilthy_Birty_Feats.mp3&type=mix' target = 'iframedownload'><br

/>MP3 Download</a></td>

</tr>

</table>

</body>
</html>

[BlobFisk]

Hi jackvull,

Can I suggest that you run your code through the W3C MarkUp Validator [validator.w3.org]. This will catch places where your markup is incorrect.

For example valign = 'center'. Not only is valign a deprecated attribute, but center is not a correct value. center is a value for horizontal alignment, for vertical alignment you want middle.

HTH

[encyclo]

You should also be careful with the order within your inline CSS for the border style. This:

border-left:solid 2px #060;

should read like this:

border-left:[b]2px solid[/b] #060;