Elemente im Text mitfließen lassen

[hpatrick]

Ich hab ein Problem:

Ich erstelle derzeit ein Layout mit DIV-Container. Funktioniert auch alles bestens bis auf ein Detail:

Einige Texte sind länger, als mein dafür definierter Bereich, und da alles später als CMS laufen wird, könnten auch noch längere Texte kommen. Kann ich mit CSS Code irgendwie einstellen, dass Elemente, wie der Footer sich dann einfach erst an das Ende des Textes setzt, und die Navigation sich ebenfalls der verlängerten Höhe des Textes anpasst?

Mein Problem derzeit ist nämlich, dass auf einmal der Footer mitten im Text liegt und die Naviagtion aufhört, obwohl der Text ja noch weitergeht. Ich hoffe, das ist so verständlich.

Ich positioniere meine Elemente mit

position:absolute;

und das ganze ohne irgendein Float.


Die Suche hab ich benutzt, aber nichts gefunden!

 

[Maik]

Vielleicht helfen dir die angehängten Lösungsbeispiele in dem Thread div height=100% nur im IE? weiter.

 

[hpatrick]

ich bin lieder eher ein Programmierer als ein Designer. Ich find da nichts, was ich in meinen Code übernehmen könnte. Hier vielleicht mal mein CSS Code (nur für die Container):

#divlogo {
			position:absolute;
			top:0px;
			left:800px;
		}

#divmainnavigation {
						position:absolute;
						top:40px;
						left:0px;
						width:800px;
						height:50px;
						background-color:#084597;
					}
					
#divquicklinks {
					position:absolute;
					top:25px;
					left:5px;
				}

#divnavigation {
					position:absolute;
					top:94px;
					left:0px;
					width:200px;
					height:800px;
					background-color:#DADADA;
				}
				
#divcontent {
				position:absolute;
				top:120px;
				left:240px;
				width:520px;
				height:774px;
				background-color:#FFFFFF;
			}

#divmedia {
				position:absolute;
				top:120px;
				left:800px;
				width:200px;
				height:774px;
				background-color:#FFFFFF;				
		  }

#divbottom {
				position:absolute;				
				top:898px;
				left:0px;
				width:100%;
				height:30px;
				background-color:#999999;
			}

#divbreadcrumbs {
					position:absolute;
					top:100px;
					left:240px;
				}

#divbalkenfill {
					position:absolute;
					top:62px;
					left:0px;
					width:100%;
					height:28px;
					background-color:#084597;
				}

 

[Maik]

Grundsätzlich kann ich zu dem gezeigten CSS-Code sagen, daß eine absolute Positionierung der Elemente für dein umschriebenes Vorhaben nicht geeignet ist.

 

[hpatrick]

was für eine Art der Positionierung kannst du mir denn empfehlen?

- relative ?
- static ?

Ich denke mal fixed ist nichts wahres...

 

[Maik]

Überhaupt keine

Verwende stattdessen die float-Eigenschaft, um Elementbereiche nebeneinander auszurichten und denke mal über die Faux-Columns-Technik nach, um für die Spalten (Navigation, Content) eine gleiche Höhe, unabhängig von ihrem Inhalt, zu erzielen.

 

[hpatrick]

ist dann aber nicht im prinzip der ganze CSS Code, den ich oben gepostet hab, Schwachsinn?

 

[Maik]

Naja, als Schwachsinn würde ich das Stylesheet nicht bezeichnen, aber für ungeeignet

 

[hpatrick]

wie wende ich denn dann am besten dieses float an? *dumm-frag*

 

[Maik]

Studiere doch einfach mal meine beiden angehängten ZIP-Dateien in dem empfohlenen Thread.