Probleme mit Container - Hintergrund

monti · #1 (**permalink**) 05.11.2005, 12:57

Hallo,
ich möchte gerne ein Website zentrieren, was auch soweit mit:

Code:

box {
	width:950px;
	margin:0px auto;
	text-align:left;
	background-color: #0071B6;
	height: auto;
}

funktioniert.
Nun möchte ich hierin ein 2-Spaltiges Layout mit folgenden Container #left, #content.
Dies funktioniert auch soweit.
Es treten aber Probleme mit dem Hintergrund auf. Da diese beiden Container ja schweben, wächst die Box nicht mit dem Inhalt, d. h. der Hintergrund füllt sich nicht flächig,
sieht man im Firefox. Im IE fällt es nicht auf.

Zur besseren Orientierung habe ich einen Rahmen um die Container gelegt.

Hier die Website:
http://www.cob-mb.de
Hier der gesamte CSS Code

Code:

/* CSS Document */

#navi{
	height:34px;
	padding:5px 0px 5px 5px;
	background-color:#0071B6;
	margin-bottom:0px;
	border-top: 0px none;
	border-right: 0px none #000000;
	border-bottom: 0px none #000000;
	border-left: 0px none #000000;
}
#left {
	width:205px;
	background-color:#0071B6;
	padding: 5px;
	margin-left: 0px;
	clear: none;
	float: left;
	border: thin solid #FF0000;
}
#header {
	padding: 10px;
	width: auto;
}
#content {
	width: 710px;
	float: right;
	background-color: #0071B6;
	border: thin solid #FF0000;
}

#box {
	width:950px;
	margin:0px auto;
	text-align:left;
	background-color: #0071B6;
	height: auto;
	border: thin solid #FF0000;
}

.

Ich könnte den ganzen Hintergrund blau machen, das möchte ich aber nicht.
Wenn ich #content nicht floatet mache, bekommte ich #left nicht auf gleiche Höhe wie content. Das funzt dann in Firefox aber nicht im IE.

Hat jemand eine Lösung?

Mit freundlichem Gruß
Monti

fricca · #2 (**permalink**) 05.11.2005, 13:04

Dein float braucht ein clear.
http://www.complexspiral.com/publica...aining-floats/

monti · #3 (**permalink**) 05.11.2005, 13:40

Hallo fricca,
danke für die schnelle Antwort.
Bin leider Neuling in Sachen CSS und Englisch ist auch schon lange her,

kannst du mir sagen wo genau das clear hinmuß

Hier nochmal der Code, und die Website.

Code:

/* CSS Document */

#navi{
	height:34px;
	padding:5px 0px 5px 5px;
	background-color:#0071B6;
	margin-bottom:0px;
	border-top: 0px none;
	border-right: 0px none #000000;
	border-bottom: 0px none #000000;
	border-left: 0px none #000000;
}
#left {
	width:205px;
	background-color:#0071B6;
	padding: 20px 5px 5px;
	clear: left;
	float: left;
	border: thin solid #FF0000;
}
#header {
	padding: 10px;
	width: auto;
}
#content {
	width: 710px;
	background-color: #0071B6;
	padding-left: 240px;
	border: thin solid #FF0000;
	clear: none;
}

#box {
	width:950px;
	margin:0px auto;
	text-align:left;
	background-color: #0071B6;
	height: auto;
	border-top: none;
	border-right: none;
	border-bottom: none;
	border-left: none;
}

http://www.cob-mb.de

left und content sollen genau nebeneinader stehen. Firefox zeigt es richtig an.

Mit freundlichem Gruß

Monti

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Mehrere kleine Container links neben einem grpßem Container	backlash86	CSS	3	24.02.2010 15:58
DIV container verschachteln und pixelgenau platzieren	Yakilo	CSS	4	02.02.2010 20:18
Probleme mit Container und I-Net Explorer	deacon	CSS	7	25.01.2006 15:53
Container mit Border macht Probleme im IE bei Floaten	mimii	CSS	2	11.11.2005 16:08
Container mit 2 Container darin -> Hintergrund anzeigen	bendar	CSS	4	05.04.2005 19:18