[saxandl]

hi!

Ich habe einen Container, in dem drei DIV's horizontal positioniert sind.
Das linke div hat 50px, das rechte 150px breite.

Wie bekomme ich das mittlere auf die "Restbreite"? Muss ich die px zählen oder geht das automatisiert?

auszug aus dem code

.links { float: left; width:50px }
.mitte { float: left; }
.rechts { float: right; width:150px }

sowie

<div>
 <div class="links>links</div>
 <div class="mitte>mitte</div>
 <div class="rechts>rechts</div>
</div>

greets!

[zeji]

Ich glaube, da musst du zählen, oder du greifst auf Javascript zurück, was dir das dynamisch abnimmt...

Kann mich aber auch irren, mir war so, als ob es da noch ein Workaround gab, bin mir aber auch grad nicht sicher.

[K.Roland]

Vieleicht so auf die Schnelle,
mit Hilfe von position, Beispiel:

html, body, div { margin: 0; padding: 0; }
}
#container {
   position: relative;
}
.links {
  width: 50px;
  position: absolute;
  top: 0;
  left: 0;
}
.mitte {
   margin: 0px 150px 0px 50px;
}
.rechts {
  width: 150px;
  position: absolute;
  top: 0;
  right: 0;
}

<div id="container">

<div class="links">... </div>
<div class="rechts">... </div>
<div class="mitte">... </div>

</div>

Nicht getestet!
____________
Gruß,
Roland

[OscarWilde1024]

Probier doch mal den YAML Builder aus, damit bekommt man das hin und auch den entsprechenden Quellcode: YAML Builder | A tool for visual development of YAML based CSS layouts

Frank

[Sinokle]

Ich würde die Mitte als eine Art Wrapper benutzen, diesen auf 100% Breite stellen und innerhalb dieses Wrappers den linken und rechten Bereich auf den entsprechenden Seiten floaten lassen.

div.mitte {
	width:100%;	
	background:lightgreen;
}
div.mitte div.links {
	width:50px;
	float:left;
	background:yellow;
}
div.mitte div.rechts {
	width:150px;
	float:right;
	background:red;
}

<div class="mitte">
	<div class="links">
		links
	</div>
        mitte
	<div class="rechts">
		rechts
	</div>
</div>