Boxen 'floaten' nicht

[maze]

Hallo,
ich komme gerade nicht weiter und hoffe das mir hier Jemand helfen kann.
Ich möchte 'meine Box3' neben meine 'Box' setzten bzw. floaten lassen.
Später sollen noch mehr Boxen hinzukommen die sich automatisch neben/unter die anderen Boxen setzen.
Der Befehl 'float: left' scheint nichts zu bewirken.
Sieht jemand woran es liegen könnte?

Hier meine Codes:

<style type="text/css" media="screen">  
  
  
#box  
	     { background-color: red; visibility: hidden; list-style-type: none; position: absolute; z-index: 2; top: auto; left: auto; width: 100%; height: 100%; min-width: 1250px; clear: right; float: left; }  
#box2  
	  { text-align: center; list-style-type: none; margin-top: 15%; z-index: 2; right: 0; left: 0; width: 100%; height: auto; }  
	  
</style>  
  
<style type="text/css" media="screen">  
  
#box3  
	    { background-color: green; visibility: visible; list-style-type: none; z-index: 1; top: auto; left: auto; position: absolute; width: 100%; height: 100%; min-width: 1250px; float: left; }  
#box4  
	  { text-align: center; list-style-type: none; margin-top: 15%; z-index: 1; right: 0; left: 0; width: 100%; height: auto; }  
  
</style>  

	<div id="box">  
			<div id="box2">  
				<a href="#MUSIC" name="MUSIC."><img src="dot.gif"></a>  
				<a href="#VIDEO" name="VIDEO."><img src="dot.gif"></a>  
				<a href="#DIARY" name="DIARY."><img src="dot.gif"></a>  
		</div></div>  
		  
		  
		  
		  
		  
		<div id="box3">  
			<div id="box4">  
				<a href="#MUSIC" name="MUSIC."><img src="dot.gif"></a>  
				<a href="#VIDEO" name="VIDEO."><img src="dot.gif"></a>  
				<a href="#DIARY" name="DIARY."><img src="dot.gif"></a>  
		</div></div>

[Beat]

ich komme gerade nicht weiter und hoffe das mir hier Jemand helfen kann.
Ich möchte 'meine Box3' neben meine 'Box' setzten bzw. floaten lassen.

Das heisst, dass du sehr wahrscheinlich auch nicht absolut positionieren willst.

mfg Beat

[maze]

Oh mann, ja klar...
Ohne 'absolut' gehts natürlich.
Danke!

[Matthias Apsel]

Om nah hoo pez nyeetz, maze!

Der Befehl 'float: left' scheint nichts zu bewirken.

es gibt keine CSS-Befehle

#box
     { background-color: red; visibility: hidden; list-style-type: none; position: absolute; z-index: 2; top: auto; left: auto; width: 100%; height: 100%; min-width: 1250px; clear: right; float: left; }

#box ist ein div-Element, als solches also automatisch so breit, wie der gesamte zur Verfügung stehende Platz.

z-Index wirkt nur auf postionierte Elemente, sollte also, da die Elemente 'neben- bzw. untereinander liegen sollen', überflüssig sein, gleiches gilt für top und left, was bei gefloateten Elementen keine Wirkung zeigt.

[code lang=html] <div id="box">
<div id="box2">
<a href="#MUSIC" name="MUSIC."><img src="dot.gif"></a>
<a href="#VIDEO" name="VIDEO."><img src="dot.gif"></a>
<a href="#DIARY" name="DIARY."><img src="dot.gif"></a>
</div></div>

box2 möchte so gern eine Liste sein.

Vielleicht fährst du mit einer Klasseneinteilung besser, als mit den vielen Ids.

Matthias