[-=[Mad]=-]

Moin moin, ich zerbreche mir schon seit längerem meinem Kopf und komme einfach zu keiner Lösung.
Folgendes Problem habe ich, ich hab mir eien DIV- Container angelegt und diesen wiederum mit DIVs versehen und ausgerichtet. Wenn ich nun Inhalt in den Content schreibe verlängert sich die Seite wunderbar, das heist das DIV "footer" wird automatisch nach unten geschoben.

Mache ich das selbe jedoch in meinem navi DIV, wird der inhalt über den footer geschrieben, ohne das er mit nach unten rutscht. obwohl alle DIVs in einen main DIV sind und der footer unter dem Main DIV.
Im IE funktioniert es bestens nur im FF und opera nicht.
Könnte mir da jemand helfen? Danke schon mal.

Ach hier meine DIVs...

<DIV id=container>
	<DIV id=header></DIV>
	<DIV id=navi></DIV>
 
  <DIV id=main>
		<DIV id=left_side>
			<DIV id=left_top></DIV>
				Navigation<br>
				 <ul>
				   <li>1</li>
				   <li>2</li>
				   <li>3</li>
				   <li>4</li>
				   <li>5</li>
				   <li>6</li>
				   <li>7</li>
				   <li>8</li>
				   <li>9</li>
				   <li>10</li>
				   <li>11</li>
				   <li>12</li>
				   <li>13</li>
				   <li>14</li>
				   <li>15</li>
				   <li>16</li>
				   <li>17</li>
				   <li>18</li>
				   <li>19</li>
				   <li>20</li>
				</ul>
		   </DIV>
		<DIV id=content>Contentbereich</DIV>
			<DIV id=right_side> 
			  <DIV id=search><input name="textfield" type="text" value="suchen"></DIV>
			</DIV>	
			 
	</DIV>
	<DIV id=footer></DIV>
</DIV>

und hier meine css ausrichtung:

BODY {
	PADDING-RIGHT: 0px;PADDING-BOTTOM: 0px;PADDING-TOP: 0px; 
	PADDING-LEFT: 0px;MARGIN: 0px;
	FONT-SIZE: 11px;
	COLOR: #000000; FONT-FAMILY: Arial; BACKGROUND-COLOR: #eae8e8; TEXT-ALIGN: left
}

#container {
	BACKGROUND-POSITION: center top;BACKGROUND-IMAGE: url(images/Bilder/main_bg.jpg); MARGIN: auto; WIDTH: 980px;BACKGROUND-REPEAT: repeat-y; TEXT-ALIGN: center;
	 BORDER-RIGHT: #666666 1px solid;  BORDER-LEFT: #666666 1px solid; COLOR: #000000; BORDER-BOTTOM: #666666 1px solid; 
top: 0;	right: 0; bottom: 0; left: 0;
}

#main {
	FLOAT: left;WIDTH: 980px; TEXT-ALIGN: left; min-height:300px;
	BACKGROUND-IMAGE: url(images/Bilder/left_bottom.jpg); BACKGROUND-POSITION: left bottom; background-repeat:no-repeat;
}
#header {
	BACKGROUND-POSITION: center top; BACKGROUND-IMAGE: url(images/Bilder/header.jpg); WIDTH: 980px; BOTTOM: 0px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 157px
}


#navi {
	BACKGROUND-POSITION: left top; BACKGROUND-IMAGE: url(images/Bilder/top_nav.jpg); BACKGROUND-REPEAT: no-repeat; HEIGHT: 33px; WIDTH: 980px;
}


#left_side {
	FLOAT: left; WIDTH: 190px;height:300px;
}
#left_top {
	background-image: url(images/Bilder/left_top.jpg); height:44px; background-repeat:no-repeat;
}

#content {
	FLOAT: left;
	WIDTH: 600px;
}

#right_side {
	FLOAT: right; WIDTH: 190px
}
#footer {
	CLEAR: both; BACKGROUND-POSITION: left bottom; FONT-WEIGHT: bold; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(images/Bilder/footer.jpg); WIDTH: 980px; COLOR: #9ea0a2; BACKGROUND-REPEAT: no-repeat; FONT-FAMILY: Arial; HEIGHT: 68px; TEXT-ALIGN: left
}
#search{
height: 44px; margin-left:9px;
}

[axx]

Zitat (-=[Mad]=-: 21.09.2007, 10:37)

Im IE funktioniert es bestens nur im FF und opera nicht.

Ich denke es ist eher andersherum, denn das Verhalten, das du beschreibst ist so gewollt. Nicht von dir, aber vom W3C.

Damit niemand lange raten muss, wäre es schön zu erfahren, von welchem Dokumententyp wir sprechen und welche Browser(-versionen) unter welchem Betriebssystem eingesetzt wurden.

[isiprimax]

Als erstes räum mal deinen css code auf.
Dann wirste sehen das ";" 2-3 mal vergessen hast.


mfg

Nachtrag -> mach aus

#left_side {
FLOAT: left;
WIDTH: 190px;
height:300px;
}

einfach
#left_side {
FLOAT: left;
WIDTH: 190px;
}

Dieser Beitrag wurde von isiprimax bearbeitet: 21. September 2007 - 15:20

[-=[Mad]=-]

oh danke mit den ";" steh ih irgendwie aufn kriegsfuß, hab ma alles durchgekuckt und funst nu.
Danke