Previous Message
Next Message

IE absolute positioning issue

Sent by Ingo Chao on 30 March 2005 10:10


Alexandru Objelean schrieb:
> ... There is a relative positioned and also
> float container, which width depends on its content. Inside it I have an
> absolutely positioned container, which I want to have the same width as
> the relative container. If I say it to be 100%, it is Ok in Mozilla and
> Opera, but in Explorer it behave completely different. 

FF1+ calculates the percentage with respect to the width of the padding 
box of the *containing block*. (CSS 2.1)

Opera8b3 calculates the percentage with respect to the width of the 
padding box of the *parent element*. (somewhere between CSS1 and 2.1) [1]

IE6 calculates the percentage with respect to the width of the *content 
box of the nearest dimensioned ancestor*. (~CSS 1)

I don't know if Mac IE5.2 follows CSS1 here.


In your example, the parent is the containing block due to the 
positioning, so Op and FF show similar results (note that FF1+ does 
respect the height:100%, Opera8 not.)

So, a part of the workaround is to add a width to the red r.p. parent, 
say 10em. But the green a. p. child is gone thin: its percentage is 
calculated with respect to the content box (10em), not to the padding 
box (12em). So you'll have to hack the padding for IE.

/* \*/
* html div.absolute { padding: 1em; }
/* */


and remove the C++ comments.

its a workaround, not a fix. the width of the relatively positioned 
floated container was determined by its content, but r.p. or float 
without a width is a challenge to IE8, I guess.

Ingo

[1] http://www.satzansatz.de/cssd/tmp/apboxpercentagewidth.html

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread:

Possibly related: