Martin Schulze: Ein div 80px auserhalb der Mitte Zentrieren

Hallo liebe Comunity,

Ich sitze seit einiger Zeit an einem Problem und hoffe dass mir hier geholfen werden kann.

Zu meinem Problem:

Meine Webseite soll bei 1024 x 768 wie folgt aussehen:

http://www.gasthaus-bad.de/1.jpg

So sieht die Webseite aber in 1024 x 768 aus:

http://www.gasthaus-bad.de/2.jpg

Ich habe das Navigationsmenü links angeordnet und den Rest mittig zentriert. Da das Navigationsmenü nun den Bilderrahmen überlappt, wollte ich diesen um ca 80 Pixel nach rechts verschieben mit "margin-left:80px;". Das Problem ist nur dass nicht nur der zentrierte Rahmen nach rechts verschoben wird, sondern auch der Hintergrund. Somit habe ich keine 1024 x 768 Pixel mehr sondern 2004 x 768. Somit bekomme ich ein Scrollbalken, den ich sehr störend finde.

Gibt es keine Möglichkeit nur die Rahmenelemente um 80 Pixel zu verschieben ohne dass sich auch der Hintergrund mitverschiebt und ich einen Scrollbalken bekomme? Ich hätte ja rechts noch genug Platz. Ich habe es leider weder mit "margin-left:80px;" noch mit "padding-left:80px;" hinbekommen.

Ich hoffe mir kann einer von euch helfen da ich ungern die Seite in Tabellen aufbauen würde und ich es mit CSS einfach nicht hinbekomme.

Hier ist übrigens die Webseite:

http://www.gasthaus-bad.de

und hier die CSS Datei:

http://www.gasthaus-bad.de/css/gasthaus-bad.css

Ich danke euch schonmal für eure Mühe.

Liebe Grüße Martin

  1. Hallo liebe Comunity,

    Hallo Martin

    Gibt es keine Möglichkeit nur die Rahmenelemente um 80 Pixel zu verschieben ohne dass sich auch der Hintergrund mitverschiebt und ich einen Scrollbalken bekomme? Ich hätte ja rechts noch genug Platz. Ich habe es leider weder mit "margin-left:80px;" noch mit "padding-left:80px;" hinbekommen.

    Schon mal versucht dem .logo ein position:relative; left:80px, der .mediaboxposition ein left:80px und dem .rahmen ein position:relative; left:80px mitzugeben?

    Liebe Grüße Martin

    Beste Grüße Marcel

    1. Hallo Marcel,

      vielen Dank für Deine schnelle Antwort. Dein Lösungsvorschlag hatte ich auch schon ausprobiert, aber da hat es mir im Internet Explorer das Design komplett zerschossen. Ich habe das CSS aber nochmal angepasst, damit Du siehst was ich meine:

      http://www.gasthaus-bad.de/devel/index.html

      Im Firefox sieht es perfekt aus, im Opera ist die Mediabox zu weit unten und im Internet Explorer 6 stimmt gar nichts mehr.

      Ich bin echt am verzweifeln. Das jeder Browser auch sein eigenes Süppchen kochen muss :-(

      Vielleicht hast Du ja noch eine Idee.

      Liebe Grüsse Martin

      1. hi $name,

        Was den IE 6+7 angeht: du könntest versuchen ihm in deiner css datei extra werte zu verpassen (google stichwort: css hack, stern html hack).

        z.b.

        div.c1 {werte für alle browser;}
        * html div.ci {werte nur für den internet explodierer;}

        gruss
        shadow

        --
        If there's anything more important than my ego around, I want it caught and shot, now.