| 
	
 | 
 Posted by richard on 11/28/07 13:44 
On Wed, 28 Nov 2007 10:12:52 +0000, Mark wrote: 
 
> Suppose I have two floated divs inside a container div to achieve a  
> simple 2-column layout: 
>  
> <div id="contentcontainer"> 
>    <div id="content">content column</div> 
>    <div id="navigation">nav</div> 
> </div> 
> <div id="footer">footer</div> 
>  
> On some pages it may be possible for there to be very little content in  
> either column but on those pages, I don't want the layout to collapse to  
> a tiny height. I'd like there to be whitespace after the content so the  
> layout still has a reasonable height. 
>  
> What is the best way to impose a minimum height? 
>  
> I'm thinking you could do this: 
>  
> #contentcontainer { 
>    height: 200px; /* For IE lte 6 */ 
> } 
> html>body #contentcontainer { 
>    height: auto; 
>    min-height: 200px; 
> } 
>  
> 200px being a more or less random value. 
>  
> This seems to work OK, but is it a reliable method? Or should I put the  
> height on one of the floated divs, not the container? 
 
Use em, not px. An em will cause the div to vary with the height/width of 
the text should the user change them. Then the minimum height would be 1em.
 
  
Navigation:
[Reply to this message] 
 |