[mudz]

hi, I have used this a couple of years ago but was wondering if it's still ok or there is a better, more recent "generally used" way of doing it.

#container {
	height: 180px;
	min-height: 180px;
}

html>body #container {
	height: auto;
}

[pob]

yer thats should be fine. Dave Woods - Freelance Web Designer UK » 100% Height Layout Using CSS

[solarisedesign]

I've always found min-heights and max-heights to be terribly unreliable. I don't think there's any "generally used" way of doing things, just whatever tends to be easiest and most effective.

My current way of doing this is floating a fixed height div to the left/right of any content

<!-- for a content element with a minimum height of 300px -->
<div>
  <div style='float:left; height:300px;'></div>
  Content here. Blah blah blah
</div>

Seems to work anyway. A bit messy but hey, gets the job done.

edit: actually, that possibly doesn't work - shall need to re-check that there...

[mudz]

[solarisedesign]

Actually, think I was thinking of something completely different :P Ah well

[Sean McP]

Yes, it is still valid.

[stugoo]

yeah thats valid.

Personally I prefer to call a different CSS for ie6 (only 'modern' browser which doesn't support min-height). This allows me to keep my 'fixes' separate.

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->


so your the declaration would be
.element { min-height : 500px;}

and in the ie6 stylesheet would have:

.element { height:500px;}

I tend to mark my CSS with any ie6 fixes with comments such as /*ie6*/

The box model for ie6 is the only browser that expands to fit the content that is inside it which is why this method, i feel, is much better.

however its down to personal preference

[pob]

Originally Posted by stugoo

yeah thats valid.

Personally I prefer to call a different CSS for ie6 (only 'modern' browser which doesn't support min-height). This allows me to keep my 'fixes' separate.

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->


so your the declaration would be
.element { min-height : 500px;}

and in the ie6 stylesheet would have:

.element { height:500px;}

I tend to mark my CSS with any ie6 fixes with comments such as /*ie6*/

The box model for ie6 is the only browser that expands to fit the content that is inside it which is why this method, i feel, is much better.

however its down to personal preference

you are right but ie6 is not a moden browser. its like 10 years old or somthing.

why are you marking you css with ie6 fix if you have a ie6 stylesheet? i personal like to keep anything to do with ie6 as far away from my main sheet as poss.

not pulling you apart just intrested.

[PartDigital]

I use this in all my stylesheets when I set min-height. It fixes the min-height issue in ie6 so you don't have to create another css file.

min-height:600px;
height:auto !important;
height:600px;

[Walenty Belsha]

The idea behind positioning is fairly simple. It allows you to define exactly where element boxes will appear relative to where they would ordinarily be or relative to a parent element, or another element, or even to the browser window itself. The power of this feature is both obvious and surprising.