div box aufbau - problem mit höhe

[henneberto]

ich krieg gleich echt die krise.

ich habe jetzt eine wrapper, eine menu und eine content box.
<div id ="wrapper">
<div id="menu"></div>
<div id="content"></div>
</div>

so. nun ist das css
#wrapper {
left:12%;
position:absolute;
width: 900px;
border:10px solid white;
background-image: url('../bilder/bg.png');
}

#showcontent{
margin-left:300px;
}

#menu {
left: 0;
width: 300px;
position:absolute;
}

jetzt soll das wrapper aber immer so hoch sein je nachdem der inhalt v on content ODER dem menü ist. das menü ändert sich variabel und der content auch.
so richtet es sich NACH DEM CONTENT AUS.
es soll sich aber AUCH nach dem MENU ausrichten.
:sad: :sad:

ich verzweifl gleich

padding, margin, alles probiert, es geht nicht...

 

[tarik02]

Faux Columns


Ich denke das hilft dir ;)


T02

 

[MasteR ChieF]

Hallo

SChau dir mal den folgenden Link an, könnte dir evtl. weiterhelfen

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

mfg
MasterChief

 

[henneberto]

ich krieg gleich echt die krise.

ich habe jetzt eine wrapper, eine menu und eine content box.
<div id ="wrapper">
<div id="menu"></div>
<div id="content"></div>
</div>

so. nun ist das css
#wrapper {
left:12%;
position:absolute;
width: 900px;
border:10px solid white;
background-image: url('../bilder/bg.png');
}

#showcontent{
margin-left:300px;
}

#menu {
left: 0;
width: 300px;
position:absolute;
}

jetzt soll das wrapper aber immer so hoch sein je nachdem der inhalt v on content ODER dem menü ist. das menü ändert sich variabel und der content auch.
so richtet es sich NACH DEM CONTENT AUS.
es soll sich aber AUCH nach dem MENU ausrichten.
:( :(

ich verzweifl gleich

padding, margin, alles probiert, es geht nicht...


edit: da sich das problem geändetr hat =)

 

[mermshaus]

Probier mal so. Ich hätte es nicht mit absoluter Positionierung gemacht und kann deshalb ehrlichgesagt nicht erklären, warum die Floats im umgebenden Element bleiben, aber so scheint es zu gehen.

#wrapper {
    left: 12%;
    position: absolute;
    width: 900px;
    border: 10px solid black;
    background: #f00 url('../bilder/bg.png');
    }

#content{          /* showcontent ? */
    width: 600px;
    float: left;
    height: 600px;
    background: #00f;
    }

#menu {
    float: left;
    width: 300px;
    height: 400px;
    background: #0f0;
    }