Undefinierter großer Abstand der divs nach floaten.

Hallo zusammen.
Ich habe meine Web-Seite SantoDaime neu gestaltet.
So soll sie also aussehen.
Hier habe ich aber den unteren Teil einfach in die linke Spalte Padrinhos
eingehängt. Für die Startseite würde es ja funktionieren. Da die Seite aber
als Vorlage für die anderen Seiten dienen soll, habe ich den mittleren Teil
in einer Testdatei versucht, mit
float zu organisieren, weil in den nachfolgenden Seiten jeweils die linke, rechte
oder auch mittlere Spalte nach unten die längste sein kann und der untere Teil
erst danach anschließen soll.
Wie in der Testdatei zu besichtigen, taucht jetzt aber ein großer Abstand
zum unteren Teil auf.
Weiß jemand, wie es richtig geht?
Gruß
Estrela

Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben

Content-ID: 109563

Url: https://administrator.de/forum/undefinierter-grosser-abstand-der-divs-nach-floaten-109563.html

Ausgedruckt am: 11.03.2025 um 19:03 Uhr

1 Kommentar

Hallo zusammen.

Ich habe hier einmal die entsprechenden divs extrahiert, um es etwas deutlicher zu machen.
Wenn ich mir meine Testseite mit Firebug ansehe, erkenne ich, das die Spalte Padrinhos nach unten viel Platz einnimmt, obwohl nicht so viel Inhalt vorhanden ist.

Kann jemand sagen, was fehlt oder falsch ist?

<body bgcolor="#000000" style="width:1024px;color:#FFFFFF;">  

<div id="oben" style="align:center;margin:0px;">   
	<div id="navioben" style="position:relative;top:-8px;left:37px;z-index:3;width:1024px;">   
   	</div><!--Ende navioben-->
  	<div id="header" style="position:relative;top:-85px;z-index:2">  
	</div>
  	<div id="pyramide" style="position:relative;top:-320px;left:35px;">   
	</div>
</div><!--Ende oben-->

<div id="mitte-vertikal" style="margin:0px;position:relative;top:-251px;width:1024px;">   
	<div id="Padrinhos" style="margin-right:0px;width:270px;float:left;z-index:2;">   
	</div><!--Ende Padrinhos-->

	<div id="Madrinhas" style="margin-left:0px;width:270px;float:right;z-index:2;position:relative;right:0px;">  
	</div><!-- Ende Madrinhas -->

	<!--Anfang mitte horizontal-->
  		<div id="mp3" style="position:relative;top:-14px;z-index:5;">  
		</div>
		<div id="Goldkranz" style="text-align:center;padding:10px;">   
		</div>
		<div id="textharmoni" style="text-align:center;padding:20px 0px;">  
		</div>
	<!--Ende mitte horizontal-->
</div><!--Ende mitte-vertikal*/-->

<div id="unten" style="clear:both;">  
</div>

</body>