Bilder unterhalb Header (im Seiteninhalt) über diesen hinaus platzieren?

  • Hallo Leute


    Gibt es wie hier Beispiel eine Möglichkeit Bilder über den Content hinaus anzeigen zu lassen, die sich natürlich anpassen entsprechend der Bildschirmgrösse?
    Der Inhalt meiner Seite ist 1024 px und mein Header (Hintergrund) ist 2200 px breit (incl. Headerinhalt)
    Ich möchte gerne Bilder die unmittelbar unter dem Header beginnen auch auf diese Breite bringen, der Content soll aber 1024 px bleiben.


    Hoffe mich verständlich ausgedrückt zu haben :thumbsup:


    Gruss Uli

    greets swissmaker

    Einmal editiert, zuletzt von swissmaker () aus folgendem Grund: Schreibfehler

  • Das ist es ja, weil es nicht so einfach ist im responsiven Modus, dass es sich anpasst ! Dazu ist sehr viel probieren notwendig im Projekt !


    Wenn es nicht responsive sein soll dann gibt es eine einfache Lösung !


    CSS
    1. <div style="background-color:#ffffff;position:absolute;right:0px;width:100%;top:500px;height:400px"></div>

    Das ist eine Codezeile für einen Bereich den man über die ganze Breite haben will. Der Top: Wert gibt an wie weit von oben es beginnen soll und die Höhe (height) wie Breit der Streifen sein soll. WEnn man mehrere Bereiche verschieden einfärben will dann muss man die Zeile kopieren und anpassen. Das ist aber nur ohne den mobilen Teil. Das was ich im "Dezember" Template erstellt habe, ist sehr viel Kleinarbeit und ich habe selber Code vom Mustertemplate kopiert und umgeändert. Vielleicht mache ich mal ein Tutorial wo es genauer erklärt wird.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Hallo swissmaker


    Warum machts nicht den Header und das Bild in "einem"? Praktisch als Header -Bg?

    Bernie


    " Was wir alleine nicht schaffen, das schaffen wir dann zusammen..."


    :thumbsup:

  • das is ka problem...
    Den beadwr bg kannst ja eh wechseln kassen.
    Gibt code dafür.


    Schau zum beispiel meine Raddorfl Seite an...


    Bin unterwegs, darum nur Handy. Aber suche hjer nach wechselnden Header bg.

    Bernie


    " Was wir alleine nicht schaffen, das schaffen wir dann zusammen..."


    :thumbsup:

  • Da hast noch den Code dafür Swissmaker


    Code
    1. <style>
    2. #imHeaderBg {height: 500px; padding-top: 0px; background-color: #transparent; background-image: url('http://dein Pfad zum Bild am Server'); background-repeat: no-repeat; }
    3. </style>

    Höhe änderst so hoch wie dein Bild dann ist.


    Pfad versteht sich eh, oder?

    Bernie


    " Was wir alleine nicht schaffen, das schaffen wir dann zusammen..."


    :thumbsup: