Arian Hojat wrote: > I was getting reaquanted with 'A List Apart's tutorial on css shadows. > and i noticed they used negative margins for pulling out the image. > I first asked myself, Why not use negative relative positioning? Is it > a matter of choice? ...
Offsetting an element (via top right bottom left) takes place once the box is laid out according to the normal flow or according to the float rules, so the following element is laid out as if the relatively positioned element was not positioned. Relative positioning creates a containing block for absolutely positioned descendants. Positioning an element may create a new stacking context, in IE6 even if z-index:auto is set, and this has implications how descendants are placed in z-axis in relation the rest of the page. Relative positioning is used -- intended or not -- as a hidden hack to fix stacking/clipping/other rendering bugs in IE6/7. Compared to relative positioning, negative margins do not create stacking contexts, but they may cause an element to overlap boxes in document source order. Negative margins move the outer edge of an element "inwards", this can make an element move, since the surrounding still touches the outer edge [1]. For the same reason, this can make an element take less space than it would normally take, so negative "backside-margins" may fix float drops in tight layouts. Two or more adjacent vertical margins may collapse into one resulting margin. Finally, in some cases, you could create results that look the same with negative margins as with relative positioning. The decision may depend on how familiar the author is with the various affected CSS-concepts mentioned above, and how the results look in selected browsers because of their rendering bugs. Others will have more to say on this. Ingo -- http://www.satzansatz.de/css.html http://www.dolphinsback.com ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
