Div layout med CSS

Højden på de to div tags skal også være ens. Så det vil sige, at selvom der er mere indhold i venstre, så skal den højre følge med...

Jeg har fundet en løsning på problemet med at den den højre div flytter ned under den venstre.
Hvis andre skulle være interesseret er det noget lign det her...

<div id="container">
  <div id="venstre" style="float: left;"></div>
  <div id="højre" style="float: left;"></div>
  <div style="clear:both;></div>
</div>

Jeg manglede den sidste div med clear:both;.

Nu mangler jeg bare at højre og venstre div er lige høje. Nogle bud?

height eller min-height

overflow: auto

evt.

Der er dynamisk indhold i begge divs, så de skal begge have samme højde som den højeste... Giver det mening??

ja det gør det, men det tror jeg ikke du kan uden hjælp fra javascript...

Trist.

Jeg lavede en hurtig test med noget js, jeg lavede en funktion i head, som tog to div tag id'er som parametre. I funktionen lavede jeg en alert der udskrev højden på mine div tags.

Jeg kaldte funktionen fra bunden af body, men alert'en var blank, den kunne ikke finde højden.

Så prøvede jeg at sætte en højde på mine div tags, så kunne den godt skrive den ud.

Ved du hvordan jeg får fat på højden efter browseren har renderet siden?

hvordan så din js-kode ud?

Den er slettet igen, men noget lign. det her...

function getMaxHeight(leftDiv, rightDiv){
  var leftDivHeight = document.getElementById(leftDiv).style.height;
  alert(leftDivHeight);
}

og så kaldte jeg den i bunden af body med div id'er.

style.height er kun defineret, hvis den er sat med CSS - for at finde den genererede højde skal du bruge offsetHeight

Cool, det prøver jeg i morgen. Jeg vender tilbage når jeg har forsøgt mig...

Her er en løsning uden javabøvl ;) http://finks.dk/css.html

-> finkagain - ja selvfølgelig (men der er nu aldrig nogen der har snakket om java ;) )

Mente også javascript. Kalder det bare javabøvl, fordi jeg altid har problemer med det ;)

@finkagain:
Det virker til at være en meget nem løsning. Det eneste jeg mangler nu, er mellemrum mellem de 2 divs. Jeg har fundet border-spacing som kan sættes på container div, men jeg er interesseret i kun at sætte fx. border-spacing-right, den findes bare ikke.
Kender du en løsning på det?

margin-right på den venstre div, eller margin-left på den højre :)

Du kan desværre ikke bruge margin, når dine divs er sat som display: table-cell;

Prøv med:

    border-right-width: 5px;
    border-right-style: solid;
    border-color: #FFF;

og

    border-left-width: 5px;
    border-left-style: solid;
    border-color: #FFF;

.. du kan selvfølgelig bare ændre border-color ;)

Men jeg har lige fundet ud af, at table og table-cell værdierne ikke virker i IE 6 og 7 + IE til mac 5.2 :(

Ja det fandt jeg også ud af...:(

Jeg fandt en løsning med med noget javascript, og det virkede... troede jeg... Firefox var ikke noget problem, men IE ødelagde det for mig. Lang historie, men det jeg skal lave skal bruges som en lille del af et rigtig stort site, og da jeg satte det hele sammen virkede det ikke længere i IE:(

Jeg har indtil videre opgivet og bare sat en højde på mine divs. Tager nok kampen op senere...

Smid nogle svar, så fordeler jeg nogle point...

jeg springer over..

Nu har jeg fundet ud af hvordan det kan gøres: http://finks.dk/css2.html

Du kan læse om det her http://www.ejeliot.com/blog/61