Zwei mal float: left, nur eines aufheben
0 
gelu
0
Zwei mal float: left, nur eines aufheben
Hallo Miteinander,
ich beiße mir schon seit Stunden die Zähne aus an diesem Problem. Habe dieses HTML (verkürzt) und will die Box "unten" unter "img" und "rechts", aber noch neben "menue". Nur wie stelle ich das an? So wie im Beispiel überlappt er mit "img". Wenn ich ein clear:left einbaue setzt er die Box auch unter "menue". Wäre dankbar für jeden Tipp.
Dirk
<html>
<head>
<title>CSS-Test</title>
<style type="text/css">
<!--
#menue{
border: 1px solid red;
float: left;
height: 300px;
width: 150px;
}
#main{
border: 1px solid green;
margin-left: 175px;
}
.img{
border: 1px solid blue;
float: left;
height: 100px;
width: 100px;
}
.rechts{
border: 1px dashed purple;
margin-left: 110px;
}
.unten{
border: 1px dashed black;
}
-->
</style>
</head>
<body>
<div id="menue">Menue</div>
<div id="main">
<div class="img">Bild<br />Bild<br />Bild</div>
<div class="rechts">Text rechts<br />neben dem Bild</div>
<div class="unten">Text unter dem Bild</div>
</div>
</body>
</html>
-
Hallo Dirk,
Wäre dankbar für jeden Tipp.
Wie umfangreich ist denn der Text rechts neben dem Bild? Falls er eine geringere Höhe hat als das Bild, könnte Dir ein margin-top für ".unten" helfen.
Beste Grüße,
gelu -
Hi,
ich beiße mir schon seit Stunden die Zähne aus an diesem Problem. Habe dieses HTML (verkürzt) und will die Box "unten" unter "img" und "rechts", aber noch neben "menue". Nur wie stelle ich das an?
Stichwort: Block Formatting Context.
http://www.1ngo.de/web/clear.html
http://aktuell.de.selfhtml.org/weblog/css-spaltenlayoutMfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“-
http://www.1ngo.de/web/clear.html
http://aktuell.de.selfhtml.org/weblog/css-spaltenlayoutMfG ChrisB
Super, der erste Link hat mir gleich geholfen. Habe das Menü jetzt absolut positioniert, damit funktioniert das wie ich es mir vorstelle. Danke dir.
-