2 CSS-Probleme

[Big Markus Style]

Hallo,
ich habe 2, mir unerklährliche Probleme mit CSS beim Coden meiner Website (bin noch nicht ganz fertig, vielleicht werden es noch mehr ). Das erste bezieht sich auf alle Browser:
unter http://www.primewebdesign.de/pwd sieht man den aktuellen Stand. Der Header und der Footer werden richtig zentriert, nur der Content-Div (beinhaltet Inhalt- und Navigations-Div) wird nicht ganz richtig zentriert: Bei meiner Bildschrimauflösung (1440x900) und dem Browserfenster in voller Größe verschiebt er sich um 1-2 Pixel. Wenn ich das Browserfenster dann kleiner mache und an der Seite schiebe/ziehe, dann wird er bei manchen Größen richtig platziert, bei manchen nicht. Kann mir jemand sagen, warum und was ich dagegen tun kann?

Das zweite Proplem bezieht sich nur auf den IE7 (auf den 6er bestimt auch^^):
Um es anschaulicher zeigen zu können, hab ich den Inhalts-Div und den Navigations-Div mal verschieden eingefärbt, zu sehen unter http://www.primewebdesign.de/pwd/index_divs.html
Man sieht: der Navigations-Div floatet nicht rechts vom Inahlts-Div, was er eigentlich tun sollte, sondern nimmt einfach darunter Platz. Kann mir da jemand helfen?
Wäre sehr nett

[blackd3sert]

Probiers mal so:

Code: Alles auswählen

#inhalt {
width: 644px;
float: left;
height: 400px;
}

#navigation {
width: 196px;
height: 400px;
float: left;
}


Allerdings würde ich nicht nen content div machen sondern einen div über das ganze, also #container wo du dann auch head und bottom mit hineintust... Dann kannst du bei jedem float: left hinzufügen und dann sollten solche Probleme nicht mehr auftretten... Kann sein das es nicht so elegant ist aber bei mir hat es bisjetzt immer funktioniert

Mfg

[Big Markus Style]

Erstmal danke für die schnelle Antwort.
Dein Vorschlag ist also, auch beim Navigations-Div float: left; hinzuzufügen, und dafür Padding rauszunehmen? Das tut irgendwie nicht: http://primewebdesign.de/pwd/index_float.html

Anfangs habe ich es übrigens auch mit 'nem #container-Div versucht, hab dann aber nicht gewusst, wie ich den Footer lösen soll. Wenn ich jetzt aber einfach nen Div um die ganze Website drum herum mache, dann meinst du, dass es geht?

[blackd3sert]

Jo dann sollte es gehen... also du musst den Container-Div um die ganze Seite setzen... Aja: Natürlich musst du dann in allen Divs die im Container sind ein float: left hinzufügen...

Mfg

[Big Markus Style]

Also grade tut's nciht so, deshlab noch ein paar Fragen:
Muss der Container-Div eine bestimmte Breite haben? Und soll der Content-Container dann weg? Und soll das padding beim Navigations-Div bleiben oder nicht? Werden damit beide Probleme gelöst oder nur das zweite?

[blackd3sert]

Content Container kann weg... Der große Container muss keine breite haben... Padding kannst du dann auch wegtun, dir ist schon klar das das der Innenabstand ist?
Das sollte auch Problem 2 beheben...

[Big Markus Style]

Es ist mir schon bekannt, dass Padding der Innenabstand ist, aber vorher ging's auch nicht ohne.
Dein Vorschlag bringt mich bisher übrigens leider noch nicht weiter, irgendwie werden jetzt nur alle width und height-Werte ignoriert

[blackd3sert]

Ich hab mal kurz ne kleine Skizze raufgeladen...
Schau mal da:
http://blackdesert.net/~admin/bd03/design.html

Also in dem Fall hat mein Container eine feste Breite...

Mfg

[Big Markus Style]

So, nachdem ich nun das Padding vom Navigations-Div in Margin umgewandelt habe, dem Inhalts-Bereich auch einen Margin-Wert verpasst habe und das mit dem Container richtig umgesetzt habe (Footer muss aus dem Container draußen bleiben, anders geht's nicht) wird alles richtig zentriert und alle Divs sind an der richtigen Stelle. Wenn du willst, kannst du dir es ja im Quellcode noch genau anschauen. Danke für deine Hilfe!

PS: Ich weis, den Content-Div könnte ich mir sparen, aber ich lass ihn trotzdem lieber da, da ich das auf diese Weise mit dem Hintegrund-Bild besser finde.

[Big Markus Style]

Ich hab nochmal ein Problem. Ich glaube es ist ein bisschen ähnlich wie in dem Thread "3-Spalten-Layout". Allerdings werde ich aus den Kommentaren und Links von dort bisher noch nciht richtig schlau. Mein aktuelles Problem ist folgendes:
Meine 2 Divs #inhalt und #navigation haben unterschiedlich viel Text. Sie haben keine feste Höhe, die Höhe soll sich an die Menge des Textes anpassen, tut sie aber nicht richtig. Zuerst war es so, dass der Inhalts-Div nur so Hoch wird, wie der Navigations-Div, der hat nämlich weniger Text, ist also kürzer. Der Text vom Inhalts-Div ging dann einfach weiter über das folgende drüber. Jetzt hab ich eine min-height von 400px eingestellt, und jetzt wird es aber auch nicht größer als 400px. Was muss ich denn tun, damit das Inhalts-Div auch so groß wird, wie der Inhalt und der Navigations-Div so groß, wie der Inhalts-Div? Hilft es da, ein Div mit folgenden CSS-Werten dran zu hängen:

Code: Alles auswählen

.cleaner {
      clear:both;
      height:1px;
      font-size:1px;
      border:none;
      margin:0; padding:0;
      background:transparent;
      }


Unter www.primewebdesign.de/pwd könnt ihr den aktuelen Stand sehen.

Bitte sagt einfach kurz, wenn ihr das Problem nicht verstehen könnt, dann versuch ich's nochmal zu erklären

[Ingo]

Hi, Markus.

Jap, ich denke, hier fehlt einfach eine clear-Box unterhalb von #navigation, z.B. so:

Code: Alles auswählen

...

</div><!-- ende navigation -->

<div style="clear:left;"></div>    <!-- neu -->

</div><!-- ende content -->

...


Die min-height-Angaben von #navigation und #inhalt sind dann nicht mehr nötig. Außerdem könnte
für .menupunkte ein margin-bottom:0px helfen, und zwar für den Fall, dass der Navi länger ist als
der Inhalt.

Gruß, Ingo

[Big Markus Style]

Ui, super!!! Vielen Dank, grade wollte ich schon fragen, warum mir keiner antwortet, aber auf dich ist halt verlass
(soll nicht heisen, dass auf blackdesert kein Verlass wäre )