Ad:

HTML and CSS Discussion Thread
Marked Solved
Views: 5889

Jan 17th, 2009

Border problems. Not working in Firefox

Expand Post »

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.

HTML Syntax (Toggle Plain Text)
<!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">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td style="border-bottom:thick #CC3333" bordercolor="#33FF00">&nbsp;</td>
  </tr>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>
<!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">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td style="border-bottom:thick #CC3333" bordercolor="#33FF00">&nbsp;</td>
  </tr>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>

Attached Images

	iecapture.bmp (868.7 KB, 176 views)
	firefoxcapture.bmp (822.5 KB, 173 views)

Similar Threads

difference between IE and Firefox in PHP
Div width and list margin problem in HTML and CSS
Help with automatic update problem and more in Viruses, Spyware and other Nasties
Help! Tab content not working in FF in JavaScript / DHTML / AJAX
Newbie in IE hell in Site Layout and Usability

VernonDozier

Featured Poster

Reputation Points: 2614

Solved Threads: 687

Posting Expert

Offline

5,372 posts
since Jan 2008

Permalink

Jan 18th, 2009

Re: Border problems. Not working in Firefox

html Syntax (Toggle Plain Text)
<table rules='all' border='0'>
<tr><td>X<td>&nbsp;<td>&nbsp;
<tr><td>&nbsp;<td>X<td>&nbsp;
<tr><td>O<td>O<td>X
</table>
<table rules='all' border='0'>
<tr><td>X<td>&nbsp;<td>&nbsp;
<tr><td>&nbsp;<td>X<td>&nbsp;
<tr><td>O<td>O<td>X
</table>

theres no need for anything fancy, table has a rules property that does what you ask

Last edited by almostbob; Jan 18th, 2009 at 1:47 am.

almostbob

Reputation Points: 562

Solved Threads: 368

Posting Maven

Offline

2,970 posts
since Jan 2009

Permalink

Jan 18th, 2009

Re: Border problems. Not working in Firefox

Just change line 26 to this: (tested in Firefox 3.0.5 under Linux)

HTML and CSS Syntax (Toggle Plain Text)
<td style="border:thin solid #33ff00; border-bottom:thick solid #CC3333">&nbsp;</td>
<td style="border:thin solid #33ff00; border-bottom:thick solid #CC3333">&nbsp;</td>

This gives a cell with green borders and a thicker red bottom border.

colweb

Reputation Points: 34

Solved Threads: 52

Posting Whiz

Offline

316 posts
since Nov 2007

Permalink

Jan 18th, 2009

Re: Border problems. Not working in Firefox

Thanks guys. Those suggestions are both useful. Thanks, colweb. I was banging my head against the wall. Perhaps Internet Explorer let me get away with something it shouldn't have and Firefox was a bit more picky? Anyway, it was driving me crazy. Thanks again.

VernonDozier

Featured Poster

Reputation Points: 2614

Solved Threads: 687

Posting Expert

Offline

5,372 posts
since Jan 2008

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in HTML and CSS Forum Timeline: Image move/replace with description change.

Next Thread in HTML and CSS Forum Timeline: Can i preload a powerpoint ?

DaniWeb Message

Cancel Changes

User Name
Password