Banner 100% Breite, Höhe anpassen

  • Hallo Zusammen,

    ich bastle an dieser Webseite: http://www.feuerwehrfraxern.at/

    Hier verwende ich das Theme Restful und habe davon ein Child-Theme angelegt mit ein paar kleinen Anpassungen. Nun möchte ich gerne, dass das Heaser-Bild immer 100% Breite vom Bildschirm einnimmt, die Höhe des Divs, in dem das Bild liegt, soll aber flexibel angepasst werden, je nachdem, welche Größe der Bildschirm hat. Wie realisiere ich das am besten?

    Hintergrund der Sache: Wie man jetzt unschwer erkennen kann, ist das Schild "140 Jahre Ortsfeuerwehr Fraxern" nicht immer vollständig sichtbar. Dies sollte aber der Fall sein.

    Beste Grüße,
    Simon

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • CSS
    .main_home {
       background-size: contain !important;
       background-color: #ddd !important;
    }


    Die Hintergrundfarbe, die durch das Skalieren sichtbar wird, entspr. nach Wunsch anpassen.

    Das ist nicht exakt das, was Du suchst, aber als Hintergrundbild ohne sonstigen Aufwand via JS schwer anders lösbar. Wenn man das Bild als <img> Tag einbinden würde, wäre es was anderes.

    Einmal editiert, zuletzt von b3317133 (31. Mai 2017 um 18:41)

  • Vielen Dank erstmal für die Antwort! Ich habe zwischenzeitlich die IMG-Lösung gefunden und angewendet. So funktioniert's jetzt, wie ich mir das vorstelle.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!