RE: [WSG] 100% width table inside a DIV [SOLVED]

[Miles Tillinger]

SOLVED ... I think!

After reading some recenet articles at positioniseverything.net I
discovered that one method of fixing the IE bug is to use the
double-wrapper method:
http://www.positioniseverything.net/explorer/percentages.html (down the
page)

Not elegant, but works for me in IE5+.

The root cause is that I'm using a fluid 3 column layout in which the
centre div does not have a fixed width.  Setting a relative width on the
centre div also caused problems.  So I have another div around the table
so it can use it as the parent element:


 ... 


So I can now have the table width set to 100% in CSS without causing any
problems.  I assume I could also set the table width inline but since
that sucks I haven't bothered to confirm it...

If there's a better way to do it I'd love to hear about it, but for now
it might just help me meet my deadline!

Regards,

Miles.
 

> -Original Message-
> From: [EMAIL PROTECTED] 
> [mailto:[EMAIL PROTECTED] On Behalf Of Miles Tillinger
> Sent: Wednesday, 17 August 2005 3:27 PM
> To: wsg@webstandardsgroup.org
> Subject: [WSG] 100% width table inside a DIV
> 
> Hi,
> 
> Consider the following example:
> 
> http://www.streetdaddy.com/temp/index.html
> http://www.streetdaddy.com/temp/index.css
> 
> I am developing a site based around this structure, however 
> something in the complicated CSS of my site is causing it to 
> not behave the same as this simple example.  The basic 
> problem is that IE5+ is calculating percentage widths based 
> on the viewport rather than its parent element, so the 100% 
> width table goes off screen and the floated inner-columns 
> don't fit next to each other .  I have tried and tried to 
> work out why this is happening, to no avail...  Can anyone 
> fill me in on the nuances of this annoying problem?  Will I 
> need to employ some browser specific hacks?
> 
> The site im developing is slightly sensitive but if needed I 
> can post up the HTML and CSS for it...
> 
> Cheers,
> 
> Miles.
> **
> The discussion list for  http://webstandardsgroup.org/
> 
>  See http://webstandardsgroup.org/mail/guidelines.cfm
>  for some hints on posting to the list & getting help
> **
> 
> 
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
**

[WSG] 100% width table inside a DIV

[Miles Tillinger]

Hi,

Consider the following example:

http://www.streetdaddy.com/temp/index.html
http://www.streetdaddy.com/temp/index.css

I am developing a site based around this structure, however something in
the complicated CSS of my site is causing it to not behave the same as
this simple example.  The basic problem is that IE5+ is calculating
percentage widths based on the viewport rather than its parent element,
so the 100% width table goes off screen and the floated inner-columns
don't fit next to each other .  I have tried and tried to work out why
this is happening, to no avail...  Can anyone fill me in on the nuances
of this annoying problem?  Will I need to employ some browser specific
hacks?

The site im developing is slightly sensitive but if needed I can post up
the HTML and CSS for it...

Cheers,

Miles.
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
**