IE8 Table TD tag and font-size - bug or standard compliant?

01/04/2008, 17h43

Not sure if this is the right spot to post this question or not.
Please let me know.

I've searched high and low for some info about this, but I can't find
anything.

Testing in IE8, I've come across a problem where HTML such as the
following does not work as expected:

<html>
<body>
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td background="1x1.gif"><img src="1x1.gif" border="0"></td>
</tr>
</table>
</body>
</html>

1x1.gif is, as the filename suggests, a 1 pixel gif image. I'd expect
that the TR row would be 1 pixel in height, for the width of the
browser window, but it is not. The only way I can make this row 1
pixel in height is to specify a font-size of 1px or smaller in a style
attribute of the TD element (or remove the img tag within the TD).

Both firefox (latest) and IE7 work as I'd expect them to. Do you
think this is a defect in IE8 or just a part of IE8's new standards
compliance? If I switch to a mode other than Standard through the IE8
developer tool (quirks mode, for example), things are fine.

01/04/2008, 19h02

On 2008-04-01, jamieb <jamie.beach@gmail.com> wrote:
> Not sure if this is the right spot to post this question or not.
> Please let me know.
>
> I've searched high and low for some info about this, but I can't find
> anything.
>
> Testing in IE8, I've come across a problem where HTML such as the
> following does not work as expected:
>
><html>
> <body>
> <table border="0" width="100%" cellspacing="0" cellpadding="0">
> <tr>
> <td background="1x1.gif"><img src="1x1.gif" border="0"></td>
> </tr>
> </table>
> </body>
></html>
>
> 1x1.gif is, as the filename suggests, a 1 pixel gif image. I'd expect
> that the TR row would be 1 pixel in height, for the width of the
> browser window, but it is not. The only way I can make this row 1
> pixel in height is to specify a font-size of 1px or smaller in a style
> attribute of the TD element (or remove the img tag within the TD).
>
> Both firefox (latest) and IE7 work as I'd expect them to. Do you
> think this is a defect in IE8 or just a part of IE8's new standards
> compliance? If I switch to a mode other than Standard through the IE8
> developer tool (quirks mode, for example), things are fine.

Are you sure you're getting Firefox in strict mode? I would expect the
td to be higher than 1px since it contains an inline image which is
aligned to the baseline of the td.

There should therefore be a gap below the image equal to the font
descent of the td's font.

Set display: block (or vertical-align: bottom) on the img and it should
work as expected in strict mode in all conforming browsers.

01/04/2008, 17h43	#1 (permalink)
jamieb Messages: n/a Hébergeur:	IE8 Table TD tag and font-size - bug or standard compliant? Not sure if this is the right spot to post this question or not. Please let me know. I've searched high and low for some info about this, but I can't find anything. Testing in IE8, I've come across a problem where HTML such as the following does not work as expected: <html> <body> <table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td background="1x1.gif"><img src="1x1.gif" border="0"></td> </tr> </table> </body> </html> 1x1.gif is, as the filename suggests, a 1 pixel gif image. I'd expect that the TR row would be 1 pixel in height, for the width of the browser window, but it is not. The only way I can make this row 1 pixel in height is to specify a font-size of 1px or smaller in a style attribute of the TD element (or remove the img tag within the TD). Both firefox (latest) and IE7 work as I'd expect them to. Do you think this is a defect in IE8 or just a part of IE8's new standards compliance? If I switch to a mode other than Standard through the IE8 developer tool (quirks mode, for example), things are fine.

01/04/2008, 19h02	#2 (permalink)
Ben C Messages: n/a Hébergeur:	Re: IE8 Table TD tag and font-size - bug or standard compliant? On 2008-04-01, jamieb <jamie.beach@gmail.com> wrote: > Not sure if this is the right spot to post this question or not. > Please let me know. > > I've searched high and low for some info about this, but I can't find > anything. > > Testing in IE8, I've come across a problem where HTML such as the > following does not work as expected: > ><html> > <body> > <table border="0" width="100%" cellspacing="0" cellpadding="0"> > <tr> > <td background="1x1.gif"><img src="1x1.gif" border="0"></td> > </tr> > </table> > </body> ></html> > > 1x1.gif is, as the filename suggests, a 1 pixel gif image. I'd expect > that the TR row would be 1 pixel in height, for the width of the > browser window, but it is not. The only way I can make this row 1 > pixel in height is to specify a font-size of 1px or smaller in a style > attribute of the TD element (or remove the img tag within the TD). > > Both firefox (latest) and IE7 work as I'd expect them to. Do you > think this is a defect in IE8 or just a part of IE8's new standards > compliance? If I switch to a mode other than Standard through the IE8 > developer tool (quirks mode, for example), things are fine. Are you sure you're getting Firefox in strict mode? I would expect the td to be higher than 1px since it contains an inline image which is aligned to the baseline of the td. There should therefore be a gap below the image equal to the font descent of the td's font. Set display: block (or vertical-align: bottom) on the img and it should work as expected in strict mode in all conforming browsers.

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email