| Autor |
Nachricht |
Sunlifestyle
Threadersteller
Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht: 
|
Verfasst Mi 05.12.2007 14:27
Titel frage zur css |
  |
|
hallo,
ich habe ein kleines problem.
ich habe einen container1 den ich über die komplette breite meiner seite ziehe und den wert float:left; besitzt.
in diesem container1 befindet noch ein container2 den ich eine feste breite gebe, nicht floate und mittig ausrichte.
in diesem container2 befinden sich wiederum 3 container345 die ich wieder floate.
klappt alles ganz gut ist auch mittig, nun will ich aber das im container 2 der background weiß ist, leider zieht er den container 2 nicht mit auf da ehr keinen float wert habe...nehme ich mal an.höhe ist auf auto gestellt.
wenn ich diesen jetzt aber floaten würde geht die zentrierung verloren.
was könnte ich also machen?
hier der code:
| Code: | #container1 {
float:left;
width:100%;
height:auto;
}
#container2 {
margin: 0 auto; /* container zentriert. */
width: 900px;
height:150px;
background-color:#ffffff;
}
#container3 {
float:left;
width:300px;
height:auto;
}
#container4 {
float:left;
width:300px;
height:auto;
}
#container5 {
float:left;
width:300px;
height:auto;
} |
| Code: | <div id="container1">
<div id="container2">
<div id="container3">hallo</div>
<div id="container4">du</div>
<div id="container5">da</div>
</div>
</div> |
|
|
| |
   |
 |
| |
|
|
Martys
Dabei seit: 07.04.2005
Ort: Bochum
Alter: 33
Geschlecht:
|
Verfasst Mi 05.12.2007 15:38
Titel
|
|
|
Habe zwar deiner Beschreibung nicht all zuviel entnehmen können, denke aber, dass du sowas (siehe Code) erreichen wolltest.
| Code: | <html>
<head>
<style type="text/css">
body {
background-color:#ff9900;
text-align:center;
margin:0 auto;
}
#container2 {
margin: 0 auto; /* container zentriert. */
width: 900px;
min-height:150px;
background-color:#ffffff;
}
* html #container2 {
height:150px;
}
#container3 {
float:left;
width:300px;
}
#container4 {
float:left;
width:300px;
}
#container5 {
float:left;
width:300px;
}
</style>
</head>
<body>
<div id="container2">
<div id="container3">hallo</div>
<div id="container4">du</div>
<div id="container5">da</div>
<br style="clear:left;">
</div>
</body>
</html> |
|
|
| |
|
|
Sunlifestyle
Threadersteller
Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht:
|
Verfasst Mi 05.12.2007 19:44
Titel
|
|
|
naja nee..nicht ganz...mir geht es ja darum das die höhe auf auto gestellt wird und der container 1 mitwandert...zurzeit ist es halt so das der container 2 durch container1 bricht.
mhh...ist m an board?
EDIT!!
falsche erklärung...der container 1 wächst mit..aber der container 2 ind dem die 3 anderen elemente gefloatet sind nicht!
Zuletzt bearbeitet von Sunlifestyle am Mi 05.12.2007 19:46, insgesamt 1-mal bearbeitet
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 05.12.2007 21:07
Titel
|
|
|
Hey. Doch das Problem liegt wie im schon erwähnt wurde im nicht aufheben der Floats.
Einfache Lösung wäre wie oben auch schon beschrieben mit einem extra Element im Quelltext
den du mit der clear Eigenschaft versiehst.
| Code: | <!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>...</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
background: #eee;
}
#container1 {
float:left;
width:100%;
background: #ff0;
}
#container2 {
margin: 0 auto;
width: 900px;
background-color: #ffffff;
background: #f00;
}
#container3 {
float:left;
width:300px;
height:auto;
}
#container4 {
float:left;
width:300px;
height:auto;
}
#container5 {
float:left;
width:300px;
height:auto;
}
</style>
</head>
<body>
<div id="container1">
<div id="container2">
<div id="container3">hallo</div>
<div id="container4">du<br />du<br />du<br />du<br />du<br /></div>
<div id="container5">da</div>
<br style="clear:both " />
</div>
</div>
</body>
</html> |
|
|
| |
|
|
Sunlifestyle
Threadersteller
Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht:
|
Verfasst Do 06.12.2007 00:50
Titel
|
|
|
okay...gut...dann danke ich erstmal...
aber ganz zufrieden bin ich da nicht..
weil letztens is mir aufgefallen das wenn ich <br style="clear:both " /> einsetze der validator meckert..
was mir nicht grade so passt..weil ich versuche so weit es geht die dokumente valide zu halten...naja jut..danke erstmal;) 
|
|
| |
|
|
nicki4lu
Dabei seit: 28.06.2005
Ort: Frankfurt (Oder)
Alter: 27
Geschlecht: 
|
Verfasst Do 06.12.2007 01:22
Titel
|
|
|
Hallo,
warum meckert denn da der Validator? Und vor allem welcher? Der fürs HTML oder der für CSS?
Ansonsten leg doch für das br eine klasse "clear" (o.ä.) an und definier das clear: both; als CSS.
Liebe Grüße,
Nicole
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
|
| |
|
|
Sunlifestyle
Threadersteller
Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht:
|
Verfasst Fr 07.12.2007 22:05
Titel
|
|
|
|
joar..werde es über css machen..na..der mäckert weil er mir sagen will...das es nicht erlaubt ist ein style element im br zu definieren...benutze http://www.validome.org/
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
[CSS] Frage zu horizontalem Menü mit CSS
CSS Frage / CMS Frage
CSS Frage
CSS Frage!
CSS Frage
Frage zu CSS
|
|
Willkommen auf dem Portal für Mediengestalter
