Problem mit float:left

enrix

Mitglied
Hallo ich habe ein Problem beim verschachteln von Boxen. In meiner CSS-Datei werden drei Boxen dargestellt. Es sind die Boxen mit den ul-Tags und der ID "MainList". Innerhalb dieser Boxen sollen die Listenelemente nebeneinander dargestellt werden. Wenn ich jedoch für die Listenelemente das CSS-Attribut float:left; letze, springen die Listenpunkte alle aus ihrem ul-Tag und dem äußeren Rahmen. Kurz gesagt ohne float:left; befindet sich alles an richtiger stelle aber sobald ich float:left setze sind die Listenpunkte vom restlichen layout getrennt. Erst wenn ich dann die ul-tags mit entsprechenden width und height -Attributen korrigiere ist wieder alles in Form. Welche möglichkeit gibt es Listenelemente nebeneinander darzustellen sodass das layout bleibt?


Hier wird alles Korrekt dargestellt. die li-Tags werden im ul-Tag aufgelistet und die ul-Tags befinden sich innerhalb des div-tags(hauptrahmen). Allerdings möchte ich alle li-Tags nebeneinander auflisten
[
Code:
<style type="text/css">	
			.main { border:1px solid #fff;}
			.main ul.MainListe{list-style-type:none; border:1px solid #fff;margin-top:10px;margin-left:10px;margin-right:10px;}
			.main ul.MainListe li.box {margin-top:30px;}
</style>
                       		<div class="main">			
				<ul class='MainListe'>													
					<li class="box">
						<div>
						test
						</div>
						<div>
						test
						</div>
					</li>				
					<li class="box">
						test
					</li>				
				</ul>
                           </div>
und nun der fall der nicht funktioniert
Code:
			.main { border:1px solid #fff;}
			.main ul.MainListe{list-style-type:none; border:1px solid #fff;margin-top:10px;margin-left:10px;margin-right:10px;}
			.main ul.MainListe li.box {float:left;margin-top:30px;}
 
Hi,

merke: "Wo gefloatet wird, muß anschliessend auch gecleart werden, um im Dokument wieder den normalen Textfluß herzustellen." - ansonsten ist dein geschildertes Problem die Folge.

Ein Blick in meinen "Sticky-Thread" hätte dir hier aber weitergeholfen, und dieses Thema, das hier schon x-mal erörtert wurde, und Grund für die Aufnahme in das "Webmaster FAQ"-Forum war, nicht erfordert.

mfg Maik
 
Zurück