Header wird gequetscht

  • Hallo Leute,

    Ich habe folgendes Problem:
    Bei meiner Website passt soweit alles, jedoch wird mir mein Headerbild am Smartphone nicht nur verkleinert sondern auch in der Länge gequetscht.
    Hat jemand eine Idee wie das zu beheben ist so dass das Headerbild nur verkleinert wird aber die Proportionen beibehält?

    Der Link zu meiner Website:
    meine-kleine-homepage.at

    Bitte nicht wundern - das Headerbild ist nur vorläufig und muss noch ersetzt werden! Daher ist hier nur ein Vorschaubild des Originals eingefügt!

    Vielen Dank und liebe Grüße,
    Alex

    • 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

  • Hallo Alex,
    das Problem ist das CSS des flexsliders.

    Dort steht:

    HTML
    img {    height: 200px;    width: 100%;}

    Damit es nicht verzerrt ist, müsste dort stehen:
    Du müsstes den Code in die style.css deines Templates schreiben und ggf. mit !important erzwingen.

    HTML
    .flexslider img {    height: auto;    width: 100%;}

    [FONT=Verdana]Ich hoffe ich konnte helfen[/FONT]

    [FONT=Verdana]Fabian[/FONT]

    WordPress seit 2012

  • Ich würde den Code von Fabian Geier auf einen bestimmten media-query beschränken:
    Media only screen and (max-width: 767px) and (min-width: 320px)

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Hallo, ich bin neu hier und hätte gleich eine Frage:

    Bei Nutzung von Twenty Seventeen und Einfügung von Headerbildern in der gewünschten Auflösung 2000 x 1200 wird der Header in der mobilen Ansicht (nicht Vorschau sondern am Endgerät) horizontal gequetscht ausgegeben. Ich habe versucht die hier beschriebenen Schritten durchzführen, jedoch finde ich nicht die entscheidende Stelle im Code Editor. Kann mir jemand helfen? Das wäre super, vielen herzlichen Dank im Voraus

    LG Hexe

  • Ich schieb das Thema mal wieder nach oben :) Vielleicht hat jemand eine Idee?

    Das Headerbild (standard) in twenty seventeen wird in der vertikalen-Ansicht horizontal gequetscht. Gerät ist Samsung mit Android Bowser. Im Firefox OK, Im Chrome auch i.O.

    Liebe Grüße :)

Jetzt mitmachen!

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