100% Height / 100% Width Problem

[Hans]

Guten Tag

Ich habe ein kleines Problem mit meinem neuen Layout.
Ich habe ein background, welcher 100% width und height hatt.

Auf der linken Seite befindet sich ein Menü welches 170px breit ist.

Nun platziere ich ein Div auf dem background, für den Inhalt. Dieses bekommt ebenfalls 100% height und width. Nun muss ich natürlich margin-left: 170px; da sonst das Menü überdeckt wird.

Und jetzt das Problem, da ich margin-left: 170px; mache und gleichzeitig width: 100% wird auf der rechten seite das div des contents 170px länger als dass des backgrounds.

Habe es schon mit right: -170px; etc. versucht, hatt aber leider nichts geholfen.

Kennt jemand eine Lösung für dieses Problem?

  
#head{  
	width: 100%;  
	height: 100px;  
	background-image: url(../img/verlauf.png);  
	position: absolute;  
}  
  
#container{  
	width: 100%;  
	height: 100%;  
	left: 0px;  
	top: 0px;  
	background-color: #e1e0e1;  
	position: absolute;  
}  
  
#leftmenue{  
	height: 500px;  
	width: 150px;  
	top: 200px;  
	left: 10px;  
	background-color: #e1e0e1;  
	position: absolute;  
}  

[T-Rex]

2 Spontane Lösungen:

1. Du gibts dem Menü auch eine Prozentangabe. Dann hat es nur bei einer speziellen Auflösung 170px.
2. Du rechnest mit calc. so z.B. width: -moz-calc(100% - 170px);
Das ist aber noch recht wackelig was die Unterstützung angeht.

Gruß
Schuldenobergrenzebestimmender
T-Rex

[Matthias Apsel]

Om nah hoo pez nyeetz, Hans!

du könntest zum Beispiel in diesem Artikel schauen, wie man ein zweispaltiges Layout realisieren könnte. (Es ist dort nicht beschrieben wie es realisiert wird, sondern es ist dort umgesetzt; du kannst dir gern den Quelltext anschauen.)

Matthias

[ChrisB]

Hi,

Und jetzt das Problem, da ich margin-left: 170px; mache und gleichzeitig width: 100% wird auf der rechten seite das div des contents 170px länger als dass des backgrounds.

Wenn du nicht dummerweise alles absolut positionieren würdest, könntest du width einfach weglassen, und als block-lement würde sich das Div dann einfach den Platz nehmen, der abzüglich dem margin noch bleibt ...

Aber auch unter Beibehaltung der absoluten Positionierung - von der ich dir trotzdem explizit abraten möchte - könntest du natürlich auf width verzichten, wenn du einfach left und right angibst.

MfG ChrisB