Re: Inconsistent position:relative behaviour

Thank you Alan and Boris for your anwers.

> Datum: Sun, 13 Feb 2011 02:15:57 +1100
> Von: Alan Gresley <alan@css-class.com>
> 
> You can either give the container a border (which you have in the third 
> example), padding or give a property and value that establishes a block 
> formatting context [2].
> 
> 
> 1. <http://www.w3.org/TR/CSS21/box.html#collapsing-margins>

It is this sentence then:

"The top margin of an in-flow block box is adjoining to its first in-flow block-level child's top margin if the element has no top border, no top padding, and the child has no clearance."

I must admit I was not aware of what this means before. Is there any use case that makes margin collapsing between parent and child elements desirable?

I'd actually suggest to drop this. Making a margin of a child element affect the behaviour of the parent looks highly counterintuitive to me. 

My use case is a very common task: A footer that sticks at the viewport bottom if there's enough space, but always remains below the content area if there is more content. I set up a test page that illustrates how I'd expect to code this:
http://www.markusernst.ch/stuff_for_the_world/css-position-test2.html

It is a simple page with a content section with margins, and header, navigation and footer sections positioned absolute in these margins. Horizontally this is no problem (and common practice), but vertically it is made impossible by the parent/child margin collapsing.

I don't see a way to fix it without extra markup[1]:
- Applying a border or padding to the parent element will make the total height more than 100%, resulting in a permanent scrollbar.
- Applying clear:both to the child element, as implied by the wording of the spec, does not help in any of the 4 browsers I tested with.


[1] To replace the top and bottom margins of the content section by marginless empty placeholder elements would of course help, but this is breaking the separation of structure and presentation.
-- 
Schon gehört? GMX hat einen genialen Phishing-Filter in die
Toolbar eingebaut! http://www.gmx.net/de/go/toolbar

Received on Saturday, 12 February 2011 18:06:29 UTC