On May 5, 2008, at 9:13 AM, Rob freeman wrote:

> Im just testing my site, though for some reason
> Safari is displaying a gap between the bookcontainer
> and the footer (temp image placed).
>
> the book container div has a large padding top as i have
> a Background image which fakes an overlap over the sidebar div.
> if there is a better way of doing this please let us know.
>
> it seems fine in FF2 and Explorer7.
>
> link: http://www.robertfreeman.co.uk/
>
> and click
> master10.html

This is an issue with the combination of 'min-height' and margin- 
collapse.

In Safari and Opera, the bottom-margin of the paragraph collapse  
through the bottom edge of the container, not taking into account the  
min-height. In Gecko browsers (Firefox), the bottom-margin of the  
paragraph is absorbed into the min-height of the container  
(#bookcontainer).

I tend to think that the behaviour of Gecko browsers is correct here,  
see the explanations in CSS 2.1:8.3.1 Collapsing margins, particularly  
this paragraph:
> "The bottom margin of an in-flow block-level element with a 'height'  
> of 'auto' and 'min-height' less than the element's used height and  
> 'max-height' greater than the element's used height is adjoining to  
> its last in-flow block-level child's bottom margin if the element  
> has no bottom padding or border. "


The situation in IE - and I assume you're testing with IE 7 - is  
different. 'min-height' triggers 'hasLayout=true', in which case  
margin-collapsing is broken in that browser (actually, the bottom- 
margin of the last paragraph descendant of #bookcontainer is reset to  
'0').

A solution: give #bookcontainer a bottom-padding of 1px to prevent the  
margins of the paragraph to collapse trough.

[1] http://www.w3.org/TR/CSS21/box.html#collapsing-margins

Philippe
---
Philippe Wittenbergh
http://l-c-n.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/

Reply via email to