Float und Brett vorm Kopf
Zeromancer
- css
0 Viennamade0 Zeromancer0 Pierre
0 Cheatah0 Zeromancer0 Cheatah
0 Thomas J.
Hallo,
ich kann leider zur Zeit keine Seite online stellen, deshalb hier mein Code.
Das Div mit der id="content" umfließt leider nicht das Div mit der id="subnavi".
Woran könnte dies liegen?
Die Validatoren für CSS und HTML auf w3c.org geben keine Fehlermeldungen aus.
HTML
----
<!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="en" lang="en">
<head>
<title>Test</title>
<link rel="Stylesheet" type="text/css" href="screen.css" />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<body>
<div id="head"> </div>
<div id="navi"> </div>
<div id="subnavi"> </div>
<div id="content"> </div>
<div id="foot"> </div>
</body>
</html>
CSS
------
html {
margin:0px;
padding:0px;
width:100%;
height:100%;
}
body {
font-size:101%;
font-family:sans-serif;
margin:0px;
padding:0px;
width:100%;
height:100%;
}
div#head {
width:100%;
height:80px;
background:#ff0000;
}
div#navi {
width:100%;
height:30px;
background:#00ff00;
}
div#subnavi {
width:150px;
height:200px;
float:left;
border:solid 2px #ff0000;
background:transparent;
}
div#content {
border:dotted 2px #000;
background:#ff8800;
}
div#foot {
clear:both;
width:100%;
height:40px;
background:#88ff00;
}
Mit freundlichen Grüßen
André
Hallo!
Das Div mit der id="content" umfließt leider nicht das Div mit der id="subnavi".
Woran könnte dies liegen?
Ein Div ist ein Rechteck, ein Rechteck kann ein anders nicht umfließen?!
Text kann ein Rechteck umfließen.
Beste Grüße
Viennamade
Hallo,
Ein Div ist ein Rechteck, ein Rechteck kann ein anders nicht umfließen?!
Text kann ein Rechteck umfließen.
Gut. Aber hilf mir mal bitte noch mal weiter. Wie ist es mit Listenpunkten ( <li> ), die ich mit float:left horizontal nebeneinander ausrichten kann? Ein weiteres Beispiel wären Verweise für eine horizontale Navigation mit display:block sowie Höhe und Breite, die ich doch auch floaten kann.
Mit freundlichen Grüßen
André
Schau dir diese Seite an, mach das Tut und du weisst Bescheid, wegen Listen und so. Empfehle dir auch das neuste Select Tutorial. Da ist so das wichtigste drin, von wegen Float, Listen und so.
Gruss
pierre
Hallo pierre,
Schau dir diese Seite an, mach das Tut und du weisst Bescheid, wegen Listen und so. Empfehle dir auch das neuste Select Tutorial. Da ist so das wichtigste drin, von wegen Float, Listen und so.
Bist ja ein ganz lustiger Typ. Finde aber hier im Forum keine Tutorials. Kleiner Tipp von meiner Seite: Ein Blick in die Vorschau dieses Forums hilft solche Fehler zu vermeiden.
Mit freundlichen Grüßen
André
Hi,
Das Div mit der id="content" umfließt leider nicht das Div mit der id="subnavi".
Woran könnte dies liegen?
height:auto berechnet sich ohne enthaltene gefloatete Elemente, es sei denn das Element selbst ist ebenfalls gefloatet.
Cheatah
Hallo Cheatah,
height:auto berechnet sich ohne enthaltene gefloatete Elemente, es sei denn das Element selbst ist ebenfalls gefloatet.
Du wolltest also sagen, ich soll eine Höhe für id="content" angeben, wobei ich auch eine relative Größe benutzen könnte?
Mit freundlichen Grüßen
André
Hi,
height:auto berechnet sich ohne enthaltene gefloatete Elemente, es sei denn das Element selbst ist ebenfalls gefloatet.
Du wolltest also sagen, ich soll eine Höhe für id="content" angeben, wobei ich auch eine relative Größe benutzen könnte?
nein ;-) weil das nur selten so genau geht.
Cheatah
Tach»»
Woran könnte dies liegen?
Der Inhalt wird "gefloatet", nicht die Box an sich. Du wirst das erkennen, wenn Du den content-div mal mit etwas text füllst.
div#content {
border:dotted 2px #000;
background:#ff8800;
margin-left:150px
}
Damit kannst Du dann auch komplett auf float verzichten.
Thomas J.
Hallo Thomas J.,
Der Inhalt wird "gefloatet", nicht die Box an sich. Du wirst das erkennen, wenn Du den content-div mal mit etwas text füllst.
div#content {
border:dotted 2px #000;
background:#ff8800;
margin-left:150px
}Damit kannst Du dann auch komplett auf float verzichten.
Vielen Dank.
Mit freundlichen Grüßen
André