[css] 100% minheight (crossbrowser)

[savale]

Ik ben bezig met een template voor mijn eigen website. Deze gaat straks gebruikt worden icm joomla of wordpress. Ik ben al goed op weg, maar er zit nog een probleem dat ik niet weg krijg zonder uit te wijken naar tables

de site gevuld met tekst
http://www.xs4all.nl/~leth/got/website/index.html

leeg:
http://www.xs4all.nl/~leth/got/website/index2.html

Nu is het zo dat ik het niet voor elkaar krijg om de hele boel een minimale hoogte van 100% te geven zodat de onderste grijze achtergrond bij weinig content niet zichtbaar wordt. Het is in mijn geval wel mogelijk om de footer "fixed" te zetten, maar dan gedraagt deze zich niet meer zoals ik wil.

Hier staat een zipje met de site:
http://www.xs4all.nl/~leth/got/website/website.zip

De site moet goed werken onder ie6 / ie7 / firefox heb ik mijzelf voorgenomen. Wie o wie weet een uitkomst voor dit probleem?

edit: dat rood / blauwe is ntl om te testen

[ Voor 3% gewijzigd door savale op 19-12-2006 19:33 ]

[tombo_inc]

als je in xhtml een height van 100% wilt hebben, dan moet je in ieder geval zorgen dat het html en body element ook een height van 100% hebben.

Cascading Stylesheet:

html, body {
  height: 100%;
}

[Fuzzillogic]

min-height werkt niet in IE6. height doet in IE6 wat min-height in moderne browsers en IE7 doet. Gebruik daar een conditional comment voor. Of gebruik Dean Edwards IE7 script.

otoh: IE6 is al jaren verouderd. En nu is er IE7. Waarom IE6, voor een prive-site? Spaar jezelfde moeite. Doe ik al jaren

[savale]

100% min-height ten op zichte van de html, body werkt ook niet in IE7. De min-height property werkt overigens wel relatief aan andere div's.
height: 100% werkt wel, maar dit geeft problemen in firefox, dus ik heb nog steeds geen goede oplossing.

[Verwijderd]

savale schreef op donderdag 21 december 2006 @ 11:27:
100% min-height ten op zichte van de html, body werkt ook niet in IE7. De min-height property werkt overigens wel relatief aan andere div's.
height: 100% werkt wel, maar dit geeft problemen in firefox, dus ik heb nog steeds geen goede oplossing.

Zoek eens naar conditional comments, dit is een nette manier om alleen IE bepaalde instructies te geven

[killercow]

savale schreef op donderdag 21 december 2006 @ 11:27:
100% min-height ten op zichte van de html, body werkt ook niet in IE7. De min-height property werkt overigens wel relatief aan andere div's.
height: 100% werkt wel, maar dit geeft problemen in firefox, dus ik heb nog steeds geen goede oplossing.

Lees de reply boven jouw reply nog eens door.

Height doet in firefox precies wat het moet doen, maar doet in IE6 wat het niet moet doen, maar daardoor haal jij min-height en height door elkaar.

Ditch ie6, ontwikkel voor opera/firefox (ie7 des noods), en fix het daarna met hacks in ie6.