Witam.
Strona, którą buduję posiada 5 div'ów. Chciałbym, aby wyglądała ona w następujący sposób: u góry baner, w środkowej części po lewej menu, po jego prawej stronie zawartość, a pod wszystkim stopka. Dodatkowo chciałbym, aby pomiędzy menu, a zawartością była kreska rozciągająca się od banera, aż po stopkę. Problem jest taki, że czasami div 'menu' jest wyższy niż 'content', a czasami jest na odwrót. Nie potrafię jednak "rozciągnąć" div'ów ('menu' lub 'content'), tak aby miały one tą samą wysokość, co pozwoliłoby mi narysowanie linii.
HTML:
<body>
<div id="main">
<div id="baner">Tutaj baner</div>
<div id="nav">Tutaj menu</div>
<div id="content">Tutaj zawartość</div>
<div id="footer">Tutaj stopka</div>
</div>
</body>
CSS:
div#main {
background-color: #FFFFFF;
border: 1px solid black;
width: 780px;
margin-left: 20px;
}
div#baner {
height: 100px;
border-bottom: 1px solid #D6D6D6;
margin: 0;
clear: both;
}
div#nav {
float: left;
border-right: 1px solid #D6D6D6;
padding-left: 0px;
text-align: left;
margin: 0px;
width: 120px;
}
div#content {
/* border: 1px solid green; */
float: right;
width: 640px;
margin-right: 5px;
text-align: justify;
}
div#footer {
clear: both;
border-top: 1px solid #D6D6D6;
margin: 0px;
}