Layout Farbe Innenbereich

[icebaer85]

Hallo,

ich beschäftige mich seit kurzem mit dem Randshop welcher mir auch sehr gut gefällt! Momentan hänge ich aber ein bisschen beim Layout ändern fest.
Ich wollte gerne den Inhaltsbereich weiß haben und den Body-Bereich grau. Den Body-Bereich konnte ich ohne Probleme einfärben und für den Inhaltsbereich
habe ich mir gedacht das ich ein neues DIV um den Content-DIV und den mainNav-DIV mache und diesen dann einfärbe. Allerdings scheint es dann doch
nicht so einfach zu sein, denn irgendwie scheint der Body-Hintergrund über den Content-Bereich zu legen (farblich), außer die Breite des neuen DIV's
wird also nichts übernommen ...

Momentan komme ich damit nicht weiter und habe mal gedacht ich könnte doch mal hier nachfragen.

Ich habe mal ein Bild mit angehängt wo Ihr es besser erkenne könnt. Also links um die Nav und rechts um den Content habe ich ein neues DIV (contentWrapper) gelegt
und dieser soll einen weißen Hintergrund erhalten (damit er sich von dem grau abhebt), was er laut dem erstellten CSS-Code auch haben sollte.
Vielleicht habe ich ja was übersehen oder einfach nur eine Blockade. Ich hoffe Ihr habt eine Idee.

Viele Grüße,
icebaer85

shopscreen.jpg (185.85 KiB) 6394-mal betrachtet

[mmaass]

Ich glaube, Du brauchst nicht unbedingt ein neues Div, dass könnte schon so gehen.
Aber schau Dir mal hier unseren Blog an.
Unter Firefox kann man den Firebug installieren und damit kannst Du alles über den Browser schon anschauen, was Du anpassen musst und auch testweise schon anpassen, bevor Du das dann in die CSS integrierst.

[icebaer85]

Ich hätte das Bild vielleicht kleiner posten sollen, das ich firebug benutze sieht man leider erst wenn man ganz runter scrollt.
Also Firebug benutz ich wie gesagt, nur das hat mich auch noch nicht auf die richtige Idee gebracht. Ich habe extra einen
DIV um den Content und das Menü gezogen damit die Fläche immer bis unten weiß ist (was ja jetzt gerade nicht der Fall ist).

Aber trotzdem schonmal ein Danke für die Antwort.

[icebaer85]

Hab es jetzt hingekriegt, es fehlte ein clear: both; und jetzt wird es richtig anzgezeigt .

Für alle die mal das selbe Problem haben sollten, hier die Lösung (vereinfachte Darstellung):

Code: Alles auswählen

<div class="contentWrapper">
    <div class="mainNav"> </div>
    <div class="content"> </div>
    <div style="clear: both;"> </div>  //WICHTIG!
</div>

Das "clear:both;" ist dabei der wichtige Faktor. Wenn gewünscht erkläre ich es gerne auch nochmal
ausführlicher (sofern die Lösung zu dem Problem nicht sowieso schon irgendwo im Forum steht, hatte es
leider nicht gefunden wenn dem so ist).

Viele Grüße,
icebaer85