Hallo,

Ik heb een probleem met de div height: auto;. Altijd als ik dit element gebruik, en er nog een element onder wil zetten, komt het element eronder niet onder die div maar onder de div erboven, die wel een vaste hoogte heeft.

Een voorbeeldje:
Ik heb een verticaal menu, bestaande uit een menutop, menucontent en menubottom. De menu top en bottom hebben een vaste hoogte, de menucontent hoogte is "auto", omdat hierin de linkjes komen, maar deze soms meer linkjes heeft dan de andere keer. Maar nu komt de menubottom niet onder de menucontent, maar dwars over de linkjes onder de menutop.

Hoe kan ik dat oplossen ?

Met vriendelijke groet,
Ricardo Persoon

height auto wil dat uberhaupt?
geen eens niks aan, geen hoogte, dan moet hij gewoon meerekken

Nee wil niet echt :)

Waarom een height: auto gebruiken? De enige keer dat ik height: auto !important; gebruik is voor de welbekende 100% height van de gehele website.

Net als hierboven wordt vermeld: een height: auto is zinloos wanneer een div moet meerekken met de inhoud want dat doet ie namelijk al automatisch.

Probeer anders eens op de betreffende divs een position: relative; te plaatsen.

Overigens: Wanneer je floats gebruikt in de div, voeg dan een overflow: hidden; toe aan je div holder.

@arjen

De hoogte van een content die moet meerekken ? Ook zonder height auto blijft het probleem zich voordoen.

Het meerekken van een div aan de hand van de content gaat automatisch, alleen zul je wanneer je floats gebruikt een overflow: hidden; mee moeten geven aan de div. Hierdoor zal de div de hoogte aannemen van de floating elementen binnen die div.

Een height: auto is in de meeste gevallen onnodig!

Edit: En in je voorbeeld kan ik het probleem niet achterhalen (het is overigens ook wel erg donker, dus slecht zichtbaar)

Ok bedankt! Ik heb ze nu even allemaal een float: left; meegegeven en nu werkt het wel :)

Even voor de duidelijkheid: Als je elementen binnen een div een float meegeeft dan rekt de div niet mee, tenzij je dus overflow: hidden; toepast op de div.
Het kan zijn dat je probleem wordt verholpen middels float: left; maar ik denk dat dit niet de daadwerkelijke oplossing is (maar als het werkt dan is het goed :) ).