Hallo, folgender css-code bringt mich zur Verzweiflung:
Ich schaffe es irgendwie nicht den rechten Bereich auszurichten.
Er rutscht immer in die Höhe des "Main" -Bereiches.
Was mache ich falsch ?
#left {
float:left;
}
#right {
float:right;
}
#left { /*linke Seite*/
background:#ffd5ee;
border:1px solid #f09;
height:750px;
}
#right { /*rechte Seite*/
background:#fff7d5;
border:1px solid #fc0;
height:750px;
}
#logo { /*Logo*/
background-color:#d5aaff;
border:1px solid #09f;
height:100px;
width:66%;
float:left;
margin-left:3%;
}
#main { /*Hauptteil*/
background-color:#d5eeff;
border:1px solid #09f;
height:750px;
width:66%;
float:left;
margin-left:3%;
margin-top:1%;
}
Hier das HTML dazu:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<HEAD>
<TITLE>4 Bereiche</TITLE>
<LINK REL="stylesheet"
TYPE="text/css"
HREF="style.css" />
</HEAD>
<BODY>
<DIV ID="left">left
</div>
<div id="logo">logo
</div>
<DIV ID="main">main
</DIV>
<DIV ID="right">right
</DIV>
</BODY>
</HTML>