fraenzer: links und rechts der mittigen Seite verschiedene Hintergründe

Guten Abend!

Ich sitze gerade an einer Homepage, die mittels margin: 0 auto horizontal zentriert angezeigt werden soll. Nun würde ich gerne links und rechts der eigentlichen Page verschiedenen Hintergrundbilder einbinden. Meine Idee besteht darin, zwei div-Container mit jeweils 100% Höhe und 50% Breite nebeneinander zu plazieren, und diese jeweils mit dem entsprechenden Hintergrund zu füllen. Dann würde die eigentliche Seite mittels position :absolute plaziert werden, was ich aber eigentlich nicht unbedingt machen will.
Zweitens fiel mir ein, einfach ein 2000 px breites Hintergrundbild zu erstellen, jeweils zur Hälfte mit dem entsprechenden Hintergrund zu versehen und das Bild horizontal mittig auf dem Bildschirm zu plazieren, allerdings ist die Lösung nicht gerade lade-freundlich bei langsamer Internetverbindung.

Gibts für mein Problem auch andere Lösungen?

Schonmal danke!

Gruß

fraenzer

  1. Wie ist es mit einem einzeiligen Tabellen-Layout?

    <table style="border: solid 1px black; width: 100%; height: 100%">  
    <tr>  
     <td style="background-color: Green;"></td>  
     <td style="background-color: White; width: 800px; vertical-align: top;">  
      Content  
     </td>  
     <td style="background-color: Blue;"></td>  
    </tr>  
    </table>
    

    Einziges Manko: ist das Browserfenster zu klein für die 800px schrumpft die Seite - aber ich wäre überrascht wenn es da nicht auch Lösungen zu gäbe.

    LG

    1. Danke erstmal für die Idee, aber Tabellen würde ich gerne komplett aussenvor lassen.

  2. Was willst denn für einen Hintergrund reinstellen? Kommt schon drauf an, wie gross die Hintergrunddatei wird. Haste kein Müsterchen?

    1. Was willst denn für einen Hintergrund reinstellen? Kommt schon drauf an, wie gross die Hintergrunddatei wird. Haste kein Müsterchen?

      Es sind einfach verschiedene vertikale Farbverläufe geplant, die Grafik ist sagen wir mal 100 px hoch und 1 px breit, und wird mittels repeat-x entsprechend oft aneinander gereiht.

      1. Hallo.

        Es sind einfach verschiedene vertikale Farbverläufe geplant, die Grafik ist sagen wir mal 100 px hoch und 1 px breit, und wird mittels repeat-x entsprechend oft aneinander gereiht.

        Wenn der Inhalt in die Breite mitwachsen soll, genügen doch ein linker Innenabstand und die Zuweisung des linken Hintergrundbildes für <html> sowie ein rechter Innenabstand und die Zuweisung des linken Hintergrundbildes für <body> oder umgekehrt.
        MfG, at