nicht angemeldet
[CSS + XHTML] Problem mit "3 Spalten" Seite
Hallo,
ich hab ein Problem...
ich möchte ein Design so wie im Bild erstellen...
soweit so gut... ich habe alles ohne tabellen gemacht, alles mit <div>
nun möglichte ich die "3 Spalten" in der mitte ebenfalls per <div> machen...
allerdings funktioniert das nicht so wie ich will Wink
Hier mein aktueller Code:
////////////////////////////////////////////////////////
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style type="text/css">
body {
margin-left: 0px;
margin-top: 0px;
}
#spalte1 {
width:170px;
position:relative;
float:left;
background:#336699;
}
#spalte2 {
left:10px;
width:250px;
position:relative;
float:left;
background:#336699;
}
#spalte3 {
left:20px;
width:450px;
position:relative;
float:left;
background:#336699;
}
</style>
</head>
<body>
<div style="float:none; width:900px;">
<div id="spalte1">test<br />hgjghj<br />hgjghj<br />hgjghj</div>
<div id="spalte2">test</div>
<div id="spalte3">test</div>
</div>
<div>testfghgfh</div>
</body>
</html>
////////////////////////////////////////////////////////
das <div>testfghgfh</div> sollte eigentlich unter den 3 Spalten sein, nicht daneben...
hab schon alles mögliche probiert... leider hab ich es trotzdem nicht geschafft...
Ich hoffe mir kann jemand helfen...
Danke
MfG
Jens
-
lass ma die position:relative ganz raus, gib nur der ersten und der zweiten spalte ein float:left und der dritten ein float:right;
richte die 3.spalte auch rechts aus: right:20px; oder so...dem <div>testfghgfh</div> gibst du dann noch ein style="clear:both;" womit es auf die floats der anderen *hüstelt* ;)
ich denk das könnte dich schonmal n stückchen weiter bringen. viel spass beim testen
-
lass ma die position:relative ganz raus, gib nur der ersten und der zweiten spalte ein float:left und der dritten ein float:right;
richte die 3.spalte auch rechts aus: right:20px; oder so...dem <div>testfghgfh</div> gibst du dann noch ein style="clear:both;" womit es auf die floats der anderen *hüstelt* ;)
ich denk das könnte dich schonmal n stückchen weiter bringen. viel spass beim testen
Vielen Dank, mir hätte nur der Befehl clear:both; gereicht :)
nun funktioniert alles, nochmals DankeMfG
Jens
-
Vielen Dank, mir hätte nur der Befehl clear:both; gereicht :)
nun funktioniert alles, nochmals Dankegern gern ;)
Das andere ist macht der gewohnheit, da es dann garantiert genau in dem von mir gewohnten stil ist ;)
wenns ohne die anderen änderungen auch wunderbar klappt: na umso besser ;)
-
-
-
Hallo Jens
das <div>testfghgfh</div> sollte eigentlich unter den 3 Spalten sein, nicht daneben...
hab schon alles mögliche probiert... leider hab ich es trotzdem nicht geschafft...Hast du ihm mal ein clear (Fortsetzung bei Textumfluss) gegönnt?
Ich hoffe mir kann jemand helfen...
Danke
MfG
Jens
Auf Wiederlesen
Detlef--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!