Aüßere Divs werden nicht vergrößert

[Cyrian]

Ich habe das Problem, dass ich meine Seite mit Divs aufgebaut hat und wenn mein Content bereich den Shader und den sizer(die bei den sollten sich vergrößern) sprengt, dann werden sie nicht mit vergrößert, so sollte es aussehen:
http://i46.tinypic.com/2j1aqad.jpg
So sieht es aus wenn ich die Größe nicht fest bestimme:
http://i49.tinypic.com/35n1t6v.jpg

Mein Quellcode:

Code: Alles auswählen

<div id="shader">
<div id="sizer">
<div id="content">
Die Sachen die die beiden vorher sprengen.
</div>
</div>
</div>


Und das ist der relevante Css-Code:

Code: Alles auswählen

#sizer {
   background-color: #333933;
   position: absolute;
   height:850px;
   width: 1012px;
   left: 5px;
   right: 5px;
   border:1px solid #000;
}
#shader {
   background-image:url(images/bg2_kl.png);
   background-repeat:repeat;
   position: absolute;
   width: 1024px;
   height: 850px;
   left:50%;
   margin-left: -512px;
}
#content {
   position: absolute;
   left: 200px;
   top: 350px;
   width: 668px;
   height: 500px;
   background-color:#333933;
}


Wie kann ich das lösen hat da vllt. jemand nen tipp?

[sejuma]

Lasse sämtliche absoluten Positionierungen weg, denn die führen je nach Fenstergröße zu unterschiedlichen Darstellungen.
Zentriere den #shader wie hier beschrieben http://www.ohne-css.gehts-gar.net/0001.php
und ordne dessen Inhalt mit float- und margin-Angaben an.

Im Prinzip hast du ja ein dreispaltiges Layout, für dessen Grundaufbau du hier ein Beispiel findest: http://www.ohne-css.gehts-gar.net/0027.php

[Cyrian]

Hmm nette Idee, aber wenn ich versuche mein Layout mit Hilfe dieses Margin: Xpx, auto; zu erstellen klebt der ganze bereich an der seite(bei opera, ie UND opera) und auserdem was is an absoluter postionierung so schlimm, meine positionierung ist so das sie bei JEDER auflösung funktioniert, die wenigstens 1024 px breit ist.

Oh ok hatte einen fehler in der css angabe deswegen hat das nicht geklappt

[Cyrian]

Es funktioiert jetzt zwar im Firefox und IE perfekt(auserdem falschem boxmodell des vllt. kann mir ja einer sagen das der da den fehler baut das der viel zu viel Abstand lässt), aber im Opera stimmt die anzeige immer noch nicht(ich habe gecleart sogar beim closen vom #shader und vom #sizer) hier mal ne pic zu verdeutlichung:
http://i46.tinypic.com/2upfvv8.jpg

Der neue Css Teil:

Code: Alles auswählen

#sizer {
   background-color: #333933;
   height:850px;
   width: 1012px;
   margin: 0px 5px;
   border:1px solid #000;
}
#shader {
   background-image:url(images/bg2_kl.png);
   background-repeat:repeat;
   width: 1024px;
   margin: 0px auto;
}
#header {
   left: auto;
   right: auto;
   width: 1012px;
   height: 300px;
   border: none;
}
#content {
   float: left;
   margin-left: 45px;
   margin-top: 50px;
   width: 668px;
   height: 500px;
   background-color:#333933;
}
#eigenschaften
{
   float: right;
   margin-left: 450px;
   margin-top: -50px;
}
#menue {
   float:left;
   margin-left: 5px;
   margin-top: 50px;
   width: 150px;
   background-color:#333933;
}


[sejuma]

Lade bitte die Seite hoch, ggf. auf einen Free-Webspace, damit man alles im Zusammenhang sehen und beurteilen kann.

[Cyrian]

:D frag mich bitte niemand warum, aber jetzt tut es komischerweise auch bei opera funktioieren vermutlich hatte der die daten noch im Cache gespeichert und hat die einfach neu geladen