Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > How to work around this IE table resizing issue?

Reply
Thread Tools

How to work around this IE table resizing issue?

 
 
Bruce C. Miller
Guest
Posts: n/a
 
      02-13-2007
Take a look at this html page:

<html>
<body>

<TABLE border=1 WIDTH="100%">

<TR>
<TD WIDTH="1">1</TD>
<TD WIDTH="1">2</TD>
<TD>333</TD>
<TD>444</TD>
</TR>

<TR>
<TD COLSPAN="4">hhhhhhhhhhhhhhhfffffffffffffffffffffff fffhhhhhhh</
TD>
</TR>

</TABLE>
</body>
</HTML>

If I pull that up in FF it looks like I want it to (the first and
second columns are small), but in IE it expands those columns (it
ignores the width=1). How do I tell IE to not automatically make those
columns whatever size it wants? It seems to have something to do with
the length of content in the COLSPAN-ed row below it, which is pretty
stupid.

 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      02-13-2007
In article
<(E-Mail Removed) .com>,
"Bruce C. Miller" <(E-Mail Removed)> wrote:

> Take a look at this html page:
>
> <html>
> <body>
>
> <TABLE border=1 WIDTH="100%">
>
> <TR>
> <TD WIDTH="1">1</TD>
> <TD WIDTH="1">2</TD>
> <TD>333</TD>
> <TD>444</TD>
> </TR>
>
> <TR>
> <TD COLSPAN="4">hhhhhhhhhhhhhhhfffffffffffffffffffffff fffhhhhhhh</
> TD>
> </TR>
>
> </TABLE>
> </body>
> </HTML>
>
> If I pull that up in FF it looks like I want it to (the first and
> second columns are small), but in IE it expands those columns (it
> ignores the width=1). How do I tell IE to not automatically make those
> columns whatever size it wants? It seems to have something to do with
> the length of content in the COLSPAN-ed row below it, which is pretty
> stupid.


Have you tried with a doctype,

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

?

And remove width in the <td...>, it is an error. If necessary
specify it in css:

td.tiny {width:1em;}

and class the <td>s concerned. If there is a meaningful reason
apart from the sheer look to so do, then use a more appropriate
name than my "tiny".

And what is this business of "1"? This means 1px in your code.
But that is not very sensible, even one character will take up
more space generally. Poor IE, what is it to do? We all now it is
a bit challenged. Why strain its brain? Better to use ems as
above.

And really, is there a good reason so want to constrain things?
Why not let the widths adjust themselves to the content and the
browser window? Even remove the width="100%".

Play about with these ideas and let us know if IE then behaves
more according to your taste (I have not looked at any of the
Wins IE for a while)

--
dorayme
 
Reply With Quote
 
 
 
 
Richard Formby
Guest
Posts: n/a
 
      02-14-2007
"Bruce C. Miller"

> Take a look at this html page:


> <html>

Where is the !DOCTYPE. You are putting IE into quirks mode where it
reproduces the bugs from prior versions.

<snip>

IE always breaks when you mix percentages and pixels in tables with colspan.
Known problem.





 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      02-14-2007
On Feb 13, 8:11 pm, "Bruce C. Miller" <(E-Mail Removed)> wrote:

> <TABLE border=1 WIDTH="100%">
> <TR>
> <TD WIDTH="1">1</TD>
> <TD WIDTH="1">2</TD>
> <TD>333</TD>
> <TD>444</TD>
> </TR>
> <TR>
> <TD COLSPAN="4">hhhhhhhhhhhhhhhfffffffffffffffffffffff fffhhhhhhh</
> TD>
> </TR>
> </TABLE>
>
> If I pull that up in FF it looks like I want it to (the first and
> second columns are small), but in IE it expands those columns (it
> ignores the width=1).


As the characters "1" and "2" are almost always wider than 1px (which
is what width="1" means in this context) then both IE and FF are
ignoring the width="1" anyway, and with good reason.

> How do I tell IE to not automatically make those
> columns whatever size it wants? It seems to have something to do with
> the length of content in the COLSPAN-ed row below it, which is pretty
> stupid.


The specification tells browsers to treat cell widths as a suggestion
and to ignore them when the content doesn't fit. IE handles this by
treating cell widths as minimum widths.

It will be hard to come up with a solution without being able to see a
real page with real content. Possible solutions include,, but probably
aren't limited to,: not using tables, using table-layout: fixed;
splitting the table into two; but which one is most appropriate will
depend on the the actual content, design and structure of the page.

Steve


 
Reply With Quote
 
Bruce C. Miller
Guest
Posts: n/a
 
      02-14-2007
On Feb 13, 5:30 pm, dorayme <(E-Mail Removed)> wrote:
> In article
> <(E-Mail Removed) .com>,
> "Bruce C. Miller" <(E-Mail Removed)> wrote:
>
>
>
> > Take a look at this html page:

>
> > <html>
> > <body>

>
> > <TABLE border=1 WIDTH="100%">

>
> > <TR>
> > <TD WIDTH="1">1</TD>
> > <TD WIDTH="1">2</TD>
> > <TD>333</TD>
> > <TD>444</TD>
> > </TR>

>
> > <TR>
> > <TD COLSPAN="4">hhhhhhhhhhhhhhhfffffffffffffffffffffff fffhhhhhhh</
> > TD>
> > </TR>

>
> > </TABLE>
> > </body>
> > </HTML>

>
> > If I pull that up in FF it looks like I want it to (the first and
> > second columns are small), but in IE it expands those columns (it
> > ignores the width=1). How do I tell IE to not automatically make those
> > columns whatever size it wants? It seems to have something to do with
> > the length of content in the COLSPAN-ed row below it, which is pretty
> > stupid.

>
> Have you tried with a doctype,
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
>
> ?
>
> And remove width in the <td...>, it is an error. If necessary
> specify it in css:
>
> td.tiny {width:1em;}
>
> and class the <td>s concerned. If there is a meaningful reason
> apart from the sheer look to so do, then use a more appropriate
> name than my "tiny".
>
> And what is this business of "1"? This means 1px in your code.
> But that is not very sensible, even one character will take up
> more space generally. Poor IE, what is it to do? We all now it is
> a bit challenged. Why strain its brain? Better to use ems as
> above.
>
> And really, is there a good reason so want to constrain things?
> Why not let the widths adjust themselves to the content and the
> browser window? Even remove the width="100%".
>
> Play about with these ideas and let us know if IE then behaves
> more according to your taste (I have not looked at any of the
> Wins IE for a while)
>
> --
> dorayme


Unfortunately, I cannot use strict since this is part of generated
markup produced by a huge n-tier app, most of which ignores strict
syntax. Rewriting the display layer of this to produce proper markup
is something I'd like to see, but would require literally months of
work and testing, and wouldn't be an easy sell to more results-
oriented people

Either way, I dislike the idea that the length of the content in the
second row effects the way IE draws the first one. It really
shouldn't, quirks-mode or not. For example, if you change the 2nd
row's content to like 4 characters, IE does exactly what I want it to.

 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      02-14-2007
Bruce C. Miller wrote:

> Either way, I dislike the idea that the length of the content in the
> second row effects the way IE draws the first one. It really
> shouldn't, quirks-mode or not. For example, if you change the 2nd
> row's content to like 4 characters, IE does exactly what I want it to.
>


Makes you kind of understand why it strikes a nerve around here when
someone make a statement like: "who cares about standards, its the most
popular 'browser' so all should do it that browser's way!"

I and many here will recommend to design for standards-compliant
browsers first, then if IE has problems, tweak or hack if you must, else
live with the difference.

You're stuck with quirks mode so it is a crap-shoot at best. You'll just
have to live with IE doing it its *own* way. IE7 is now out and it is
clear how MS feels about this.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
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
Re: How include a large array? Edward A. Falk C Programming 1 04-04-2013 08:07 PM
Resizing a div by resizing its borders Pil (Trustworthy from Experience) Javascript 9 04-21-2009 07:35 AM
Resizing a div by resizing its borders Proper Javascript 0 04-18-2009 08:02 PM
Table where I want to draw a border around the whole table but not between the cells. UJ ASP .Net 8 06-12-2006 06:20 PM
Read all of this to understand how it works. then check around on otherRead all of this to understand how it works. then check around on other thelisa martin Computer Support 2 08-18-2005 06:40 AM



Advertisments