Works in IE but not in Opera or Firefox

J

John Dalberg

The html below displays correctly in IE but not in Opera nor Firefox. The
problem is with the style attribute for tbody tag. If I remove it, the
display is fine. So my question is what's wrong with the style in tbody..
isn't that supported?

John Dalberg

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>

<table cellspacing="0" cellpadding="0" border="1" id="MainContent"
width="478">
<tr> <td style="padding:3; ">
blah blah blah
<form action="do.asp" method="post" >
<table border="1" bordercolor="#00FF33" cellpadding="2"
cellspacing="0" width="100%">
<tr>
<td colspan="4" bgcolor="#43aae3" align="center"> <span
style="color:#FFFFFF; text-align:center;"> <b>Contact
Detail</b></span></td>
</tr>
<tr>
<td><img src="images/ClearPixel.gif" width="91" border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" width="176" border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" width="66" border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" width="145" border="0"
height="1"></td>
</tr>
<tr>
<td align="right">Domain Name:</td>
<td align="left"><input type="text" name="DomainName" size="22"
maxlength="50" tabindex="1"></td>
<td align="right">Email Address:</td>
<td align="left"><input type="text" name="Email" size="18"
maxlength="50" tabindex="2"></td>
</tr>
<tbody style="display:block; ">
<tr>
<td align="right">First Name:</td>
<td align="left"> <input type="text" name="FirstName"
size="22" maxlength="50" tabindex="3"></td>
<td align="right">Last Name:</td>
<td align="left"><input type="text" name="LastName" size="18"
maxlength="50" tabindex="4"></td>
</tr>
</tbody>
</table>


</body>
</html>
 
S

SpaceGirl

John said:
The html below displays correctly in IE but not in Opera nor Firefox. The
problem is with the style attribute for tbody tag. If I remove it, the
display is fine. So my question is what's wrong with the style in tbody..
isn't that supported?

John Dalberg

<snip>

padding:3; Three what? Miles? Inches? Frogs Legs? You must specify units.

padding:3px;

--


x theSpaceGirl (miranda)

# lead designer @ http://www.dhnewmedia.com #
# remove NO SPAM to email, or use form on website #
 
B

brucie

In alt.html John Dalberg said:
The html below displays correctly in IE but not in Opera nor Firefox.

you mean it displays how you think it should in IE, not displays
correctly.

please supply a URL in future.
 
M

Mark Parnell

The html below displays correctly in IE but not in Opera nor Firefox. The
problem is with the style attribute for tbody tag. If I remove it, the
display is fine. So my question is what's wrong with the style in tbody..
isn't that supported?

Yes, when you use it correctly.

That code is far more complicated than necessary, even if (ab)using
tables for layout. You should also take a trip to the validator.
<td style="padding:3; ">

Better break out those hobnobs again, Toby. (Hint: the unit is required
when specifying a non-zero value for padding.)
 
C

C A Upsdell

John Dalberg said:
The html below displays correctly in IE but not in Opera nor Firefox. The
problem is with the style attribute for tbody tag. If I remove it, the
display is fine. So my question is what's wrong with the style in tbody..
isn't that supported?

Besides forgetting to specify units for the padding, you use the attribute
BORDERCOLOR in one of your tables. this attribute is IE proprietary, not in
the standards, so what do you expect other browsers to do with it?

Suggestion: code to the standards, validate your code, make sure it works
with standards-compliant browsers first, and then see what you have to do to
work around IE's inadequacies.
 
L

Leif K-Brooks

C said:
Besides forgetting to specify units for the padding, you use the attribute
BORDERCOLOR in one of your tables. this attribute is IE proprietary, not in
the standards, so what do you expect other browsers to do with it?

FWIW, Gecko (newer versions, at least) unfortunately supports it.
 
C

C A Upsdell

Leif K-Brooks said:
FWIW, Gecko (newer versions, at least) unfortunately supports it.

But can you COUNT on Gecko supporting a non-standard feature in the future?

Also, does Gecko support it in standards mode?
 
R

rf

John Dalberg wrote
<tbody style="display:block; ">

If this is following on from your last thread then you do not want to apply
display: block to a tbody. I suspect this takes it out of the table and
makes it onto a seperate block, yet still within the table, which the
browser has to error correct. As you have found browsers error correct
differently.

Give it whatever.display = "none" to disappear it but when you want it
visible again give it whatever.display = "". This "rubs out" the display:
none.
 
J

John Dalberg

In alt.html John Dalberg said:


you mean it displays how you think it should in IE, not displays
correctly.

please supply a URL in future.

It displays correctly and how I think it should in IE.
I supplied the full html. You can simply copy and paste it.

John Dalberg
 
J

John Dalberg

Besides forgetting to specify units for the padding, you use the attribute
BORDERCOLOR in one of your tables. this attribute is IE proprietary, not in
the standards, so what do you expect other browsers to do with it?

I expect them to ignore it like they should.

John
 
R

rf

John said:
It displays correctly and how I think it should in IE.

But it does not in other browsers. This indicates that you have a bug in
your HTML. IE takes great pains to try to interpret what you *meant*, not
what you *said*. Other browsers simply give up and take you at your words.

BTW see my other post in this thread :)
I supplied the full html. You can simply copy and paste it.

So before we help you for free we have to do this bit of work. Well, the
last bloke whose question I answered simply posted a link. All I had to do
to view the problem was to click on it.

With yours I have to open an editor, open your post, copy from your post,
paste in my editor, save the file somewhere on my local file system, fire up
a broser, labouriously point that browser to the saved file.

Is that as easy as clicking a link?

Besides whilst you have supplied the HTML and CSS You have not supplied the
images. Unlikely in this case but I have seen sites fall apart because of
things that ARE NOT in the HTML or CSS but included.

Plus, how do we know what you have supplied there is exactly the same as the
file you have. Consider the word wrap the news client introduces. Some
layout problems are caused by incorrect wrapping.

All things considered I think you lose on this one :)
 
J

John Dalberg

Yes, when you use it correctly.

That code is far more complicated than necessary, even if (ab)using
tables for layout. You should also take a trip to the validator.


Better break out those hobnobs again, Toby. (Hint: the unit is required
when specifying a non-zero value for padding.)

It's not complicated. Just two simple tables one nested in the other. Maybe
there are better ways using css only but my method is not *wrong*.
Now it html and css validates with 0 errors and still the problems
persists.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<table cellspacing="0" cellpadding="0" border="1" id="MainContent"
width="478">
<tr>
<td style="padding:3px; "> blah blah blah
<form action="do.asp" method="post" >
<table border="1" cellpadding="2"cellspacing="0" width="100%">
<tr>
<td colspan="4" bgcolor="#43aae3" align="center"> <span
style="color:#FFFFFF; text-align:center;"> <b>Contact
Detail</b></span></td>
</tr>
<tr>
<td><img src="images/ClearPixel.gif" alt ="" width="91"
border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" alt ="" width="176"
border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" alt ="" width="66"
border="0"
height="1"></td>
<td><img src="images/ClearPixel.gif" alt ="" width="145"
border="0"
height="1"></td>
</tr>
<tr>
<td align="right">Domain Name:</td>
<td align="left"><input type="text" name="DomainName" size="22"
maxlength="50" tabindex="1"></td>
<td align="right">Email Address:</td>
<td align="left"><input type="text" name="Email" size="18"
maxlength="50" tabindex="2"></td>
</tr>
<tbody style="display: block ">
<tr>
<td align="right">First Name:</td>
<td align="left"> <input type="text" name="FirstName"
size="22" maxlength="50" tabindex="3"></td>
<td align="right">Last Name:</td>
<td align="left"><input type="text" name="LastName" size="18"
maxlength="50" tabindex="4"></td>
</tr>
</tbody>
</table>
</form></td>
</tr>
</table>
</body>
</html>
 
J

John Dalberg

So what _is_ the "correct" behaviour that IE is exhibiting that the
other browsers aren't?

In IE each row has 4 columns and they display correctly as I expect. In
Firefox, the first column with the 'domain name' label is very wide and it
shows on top of the third column of the row beneath it. If I take the style
off from tbody, it displays correctly in Firefox. I just wanted to know why
the style:display is messing things up.

Sorry I don't have a site to show this. I will try tomorrow.

John Dalberg
 
R

rf

John Dalberg wrote
It's not complicated. Just two simple tables one nested in the other. Maybe
there are better ways using css only but my method is not *wrong*.

<bangs brucies head on desk />

Yes, *it is wrong*. You are applying display: block to an element where that
does not make sense. Table bodies can *not* be block level element. It does
not pull an error because it *is* syntactally correct. However it is most
certainly semantically incorrect. It's like saying body {display: inline;}.
Syntax is correct but what do you think a browser would do with it?

Just why do you want to turn a <tbody> element into a block level element in
the first place?

At the very least you should be using display: table-row-group (as per the
CSS specification, chapter 17).

Ideally you should omit the display property altogether and let the default
style sheet (appendix A in the spec) override the default display: inline
with display: table-row-group.

<snip code which I will *not* copy/paste as there is no need to, the error
sticks out like dogs balls>
 
M

Mark Parnell

It's not complicated.

Certainly looks it from here.
Now it html and css validates with 0 errors and still the problems
persists.

You still haven't told us what you believe the actual problem to be -
only that IE displays it differently (whatever that means) to other
browsers.

Others have already told you that the problem is probably due to the
display:block. If, after removing that, the problem still occurs,
explain exactly what isn't working the way you expect, and post a URL
displaying the behaviour in question.
 
N

Neal

John Dalberg wrote:

Commenting solely on the subject line:

It's wise to assume that whenever IE does it and no one else does, you've
screwed it up.
 
J

John Dalberg

In alt.html John Dalberg said:



no it doesn't

Why do you think it doesn't display correcty and how do you think it should
display correctly?
displaying how you think it should and displaying correctly are not the
same thing.

It's displaying how it should display correctly.

santa wont be visiting you this year

good.

John Dalberg
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,832
Latest member
GlennSmall

Latest Threads

Top