Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Firefox and style="display:block" on table row

Reply
Thread Tools

Firefox and style="display:block" on table row

 
 
Christophe MERESSE
Guest
Posts: n/a
 
      01-03-2005
Hi,

I encountered a problem with a table in Firefox:

<table border="1">
<tr><td>Col1</td><td>Col2</td></tr>
<tr style="display:block"><td colspan="2">This cell should take 2 columns
but does not because of the display:block</td></tr>
</table>

This problem has been raised by John Dalberg at the begining of
november (I found it with google groups) and he has been sadely shot down in
flames.
but I was in the same situation and I really think that it is a firefox bug.

If you replace display:block by display:anything it works fine both in IE
and firefox so that my problem
is solved but I really wonder what the "block" word does wrong in Firefox...

Regards
Christophe


 
Reply With Quote
 
 
 
 
Christophe MERESSE
Guest
Posts: n/a
 
      01-04-2005
"Christophe MERESSE" <> a écrit dans le message de news:
crclb6$kbg$...
>
> If you replace display:block by display:anything it works fine both in IE
> and firefox so that my problem
> is solved but I really wonder what the "block" word does wrong in
> Firefox...
>

I was too optimistic, my problem is not solved because when I change the
display style with javascript
with element.style.display='none' and then element.style.display='block_it'
it does not display it back and
with element.style.display='block' I get into the colspan problem again...

So the problem is still open.

Christophe


 
Reply With Quote
 
 
 
 
Steve Pugh
Guest
Posts: n/a
 
      01-04-2005
"Christophe MERESSE" <> wrote:

>I encountered a problem with a table in Firefox:
>
><table border="1">
><tr><td>Col1</td><td>Col2</td></tr>
><tr style="display:block"><td colspan="2">This cell should take 2 columns
>but does not because of the display:block</td></tr>
></table>


So the second <tr> is no longer a table row, but is instead a block.

So why should the <td>s within it be treated as if they were still
within a table row?

This is what I think is happening: the <tr> is now a block (i.e. it
might as well be a <div> as far as formatting goes), but is within the
<table>. The only way this can work is if the block <tr> is within one
of the cells of the table. Obviously not one of the cells defined by a
<td> but an anonymous cell created in the first column of an anonymous
row. If the <tr> is within the first column then the <td> within that
can't possibly span over into the second column.

>This problem has been raised by John Dalberg at the begining of
>november (I found it with google groups) and he has been sadely shot down in
>flames.
>but I was in the same situation and I really think that it is a firefox bug.


Opera agrees with FF. As IE has only basic support for the CSS display
property, the chances are that IE is wrong and FF and Opera are right.

>If you replace display:block by display:anything it works fine both in IE
>and firefox so that my problem


Well display: anything is undefined in the spec so the default value
for <tr>, i.e. display: table-row (which IE doesn't support), should
be used instead.

>is solved but I really wonder what the "block" word does wrong in Firefox...


It turns the <tr> into a block instead of a table-row. What else could
it do?

Steve

 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      01-04-2005
"Christophe MERESSE" <> wrote:

>"Christophe MERESSE" <> a écrit dans le message de news:
>crclb6$kbg$...
>>
>> If you replace display:block by display:anything it works fine both in IE
>> and firefox so that my problem
>> is solved but I really wonder what the "block" word does wrong in
>> Firefox...
>>

>I was too optimistic, my problem is not solved because when I change the
>display style with javascript
>with element.style.display='none' and then element.style.display='block_it'
>it does not display it back and


Of course it doesn't. block_it isn't a valid value for the display
property. So it gets ignored and the previously set none is used
instead.

>with element.style.display='block' I get into the colspan problem again...
>
>So the problem is still open.


You'll need to branch your script and return block to IE and table-row
to browsers that actually support CSS2.

Steve

 
Reply With Quote
 
rf
Guest
Posts: n/a
 
      01-04-2005
Christophe MERESSE" <> wrote
> Hi,
>
> I encountered a problem with a table in Firefox:
>
> <table border="1">
> <tr><td>Col1</td><td>Col2</td></tr>
> <tr style="display:block"><td colspan="2">This cell should take 2 columns
> but does not because of the display:block</td></tr>
> </table>
>
> This problem has been raised by John Dalberg at the begining of
> november (I found it with google groups) and he has been sadely shot down

in
> flames.
> but I was in the same situation and I really think that it is a firefox

bug.
>
> If you replace display:block by display:anything it works fine both in IE
> and firefox so that my problem
> is solved but I really wonder what the "block" word does wrong in

Firefox...

It's not a bug in the browser (or browsers) it's a bug in your code.

<tr> elements (table rows) have a default display proterty of display:
table-row; That is what makes them table rows.

If you apply display: block; to one then it is no longer a table row, it is
a standard block. It is as if you were to code:

<table border="1">
<tr><td>Col1</td><td>Col2</td></tr>
<div><td colspan="2">This cell should take 2 columns
but does not because of the display:block</td></div>
</table>

The reason it "appears" to work with IE is probably because IE is
error-correcting the display property for you.

Why do you want to do this anyway? The validator would have told you your
code is incorrect. Throw incorrect code at a browser and who knows what will
happen.

--
Cheers
Richard.


 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      01-04-2005
"rf" <rf@.invalid> wrote:
>Christophe MERESSE" <> wrote
>>
>> <table border="1">
>> <tr><td>Col1</td><td>Col2</td></tr>
>> <tr style="display:block"><td colspan="2">This cell should take 2 columns
>> but does not because of the display:block</td></tr>
>> </table>
>>

>The validator would have told you your code is incorrect.


Would it? The above is valid HTML and 'valid' CSS.

It's fairly mad CSS but that's not something the validator looks
for...

Steve

 
Reply With Quote
 
rf
Guest
Posts: n/a
 
      01-04-2005
"Steve Pugh" <> wrote
> "rf" <rf@.invalid> wrote:


> >The validator would have told you your code is incorrect.

>
> Would it? The above is valid HTML and 'valid' CSS.


Hmmm. Absolutely correct

--
Cheers
Richard.


 
Reply With Quote
 
Spartanicus
Guest
Posts: n/a
 
      01-04-2005
Steve Pugh <> wrote:

>You'll need to branch your script and return block to IE and table-row
>to browsers that actually support CSS2.


No need for that, setting the display property to "block" first and then
again to "table-row" should be sufficient providing that the 2 are not
conjoined (conjoining confuses IE).

--
Spartanicus
 
Reply With Quote
 
Michael Winter
Guest
Posts: n/a
 
      01-04-2005
On Tue, 04 Jan 2005 00:57:17 +0000, Spartanicus <> wrote:

> [...] setting the display property to "block" first and then again to
> "table-row" should be sufficient providing that the 2 are not conjoined
> (conjoining confuses IE).


Even that should be unnecessary. Provided that the property is set via the
style attribute (or style object), which it is in this case,

element.style.display = '';

will effectively remove the inline style value allowing the browser to
return to the inherited value.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
 
Reply With Quote
 
Michael Winter
Guest
Posts: n/a
 
      01-04-2005
On Tue, 04 Jan 2005 00:21:43 GMT, rf <rf@.invalid> wrote:

[snip]

> The reason [block] "appears" to work with IE is probably because IE is
> error-correcting the display property for you.


As others have implied, IE has no concept of the table-row value. In fact,
Microsoft's documentation
(<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp>)
clearly states that all block-like elements (with a few exceptions) have
'block' as their display value, contrary to specification.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Copy a row from Table A to position 0 in Table B dave@softwareonline.com ASP .Net 1 03-24-2008 08:14 PM
row bottom border in inner table not matching up with row border in outer table phl HTML 1 06-08-2006 03:43 PM
ie6 Insert Row at specific Row Index of Table Giggle Girl Javascript 18 02-07-2006 07:54 AM
ok I can do a totals row but how about a percentage row after each data row D ASP .Net Datagrid Control 0 05-23-2005 04:10 PM
Can center row in three row table take up remaining space? Anon HTML 2 03-18-2005 08:35 AM



Advertisments