I've been designing a Tic-Tac-Toe game using a 3 x 3 table. Different cells will have different borders: border-right will exist for left two columns cells, border-bottom will exist for top two rows of cells. It's working the way I think it should in Internet Explorer, but not in Firefox. There is a red line in the Internet Explorer table, which is what I want (I made a single red line just to demonstrate here), but not int Firefox. Please see the code and the two photos. The relevant line is line 26. The border-bottom
appears to have no effect in Firefox.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<table width="586" height="493" border="15" cellpadding="0" cellspacing="0" bordercolor="#9933CC">
<tr>
<td bordercolor="#6666FF"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td style="border-bottom:thick #CC3333" bordercolor="#33FF00"> </td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>