[HTML] DIV float hoogte bepalen - Softwareontwikkeling

vrijdag 28 september 2007 12:34

Acties:

Verwijderd

Topicstarter

Zoals hieronder te zien in het voorbeeld wil ik de navigation (blauw) en het zwarte gedeelte uitlijnen tot 100% zodat de pagina van boven tot onder beeld vullend is.
Nu lukt het mij maar niet om dit voor elkaar te krijgen in css. Kan iemand mij uitleggen wat ik verkeerd doe? Tevens wil ik straks aan de zijkanten een schaduw laten lopen hoe kan ik dit het beste aanpakken?

HTML: text

<html>
<head>
<title>None</title>

<style type="text/css">
body {
text-align: center; /* centreren  in pre-IE6 */
height: 100%; 
margin: 0px; 
} 

#container {
min-height: 100%; 
margin: auto;
width: 800px;
}

#header {
background-color: green;
height: 150px;
width: 800px;
}

#navigation {
background-color: blue;
height: 100%;
float: left;
width: 150px;
}

#content {
background-color: black;
height: 100%;
float: right;
width: 650px;
}

#footer {
background-color: yellow;
height:50px;
clear: both;
}

</style>

</head>

<body>
<div id="container">

    <div id="header">         Header     </div>
    <div id="navigation">     Navigation  </div>
    <div id="content">   Content    </div>
    <div id="footer">         Footer     </div>
    
</div>
</body>

</html>

Afbeeldingslocatie: http://i23.tinypic.com/330wyfs.jpg

vrijdag 28 september 2007 12:56

Acties:

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Faux Columns en al honderden keren voorbij gekomen.

[ Voor 145% gewijzigd door RobIII op 28-09-2007 12:57 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

vrijdag 28 september 2007 12:59

Acties:

TeeDee

CQB 241

Ik zou eens in [CSS] De perfecte CSS-only footer kijken. Daar staan een aantal mooie oplossingen.

Dit in combinatie met Faux Columns (voor je schaduw) moet je al aardig op weg helpen gok ik.

Heart..pumps blood.Has nothing to do with emotion! Bored