Mobile Version - Headerbild verzerrt

  • Hallo,

    ich bekomme für meine mobile Version einfach kein unverzerrtes Headerbild hin.

    Sonst passen alle kleineren Bilder, Flip-Boxen....

    Hat jemand eine Ahnung wie ich die Bildgröße für die mobile Version festlegen kann?

    Hab auch schon das Plugin RICG Responsive Images installiert. Nichts geändert.


    Wie immer danke ich für eure tolle Zusammenarbeit

    • 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

  • Ich bin zwar Laie, aber ich sehe nur eine Frage und wenn ich mich nicht irre wäre das über das css zu lösen.
    Doch habe ich das Gefühl das dies nicht die Antwort ist die du haben wolltest. Aber wie wäre es wenn du uns den Link zu deiner Seite lieferst oder zumindest mal mehr informationen damit man sich das ganze ansehen kann?

    gruss Benzli

  • Den Link kann ich leider nicht veröffentlichen. Es geht alles außer die Headerbilder.

    Ich hab irgendwo gelesen, dass man diese in HTML anpassen kann, würde dies aber lieber
    mit einem Plugin beheben. Ich denke, dass Problem tritt bestimmt häufiger auf und müsste
    eigentlich fix zu lösen sein.

    gruss Drag and Drop

  • Den Link kann ich leider nicht veröffentlichen. Es geht alles außer die Headerbilder.

    Ich hab irgendwo gelesen, dass man diese in HTML anpassen kann, würde dies aber lieber
    mit einem Plugin beheben. Ich denke, dass Problem tritt bestimmt häufiger auf und müsste
    eigentlich fix zu lösen sein.

    Deine Annahme, es wurde häufiger auftreten und es würde eine "allgemeine" Lösung geben ist leider nicht richtig. Auch ein Plugin wird das Problem nicht lösen können.

    Wie Benzli schon richtig gesagt hat, handelt es sich mit hoher Wahrscheinlichkeit um ein CSS Problem auf deiner Seite bzw. deinem Theme. Das ist sehr individuell und ohne Link zur Seite eigentlich kaum (nicht) lösbar...

  • Danke für die Antwort. Da lag ich wohl falsch. Die Dinge könnten so einfach sein :-)

    Wo muss ich denn normalerweise im CSS nachschauen, damit die Übertragung passt?

  • Ausserdem, warum ständig PlugIns installieren die nur den Server mehr belasten und die Website lahmer machen statt das Problem richtig zu lösen?

    Wo du im css nachschauen musst? Na dort wo die Einstellung für die Bilder hinterlegt ist und weil du ja vom Mobilen Design sprichst, dort wo diese Daten hinterlegt sind.
    Wie gesagt, du willst uns keine Infos liefern, somit können wir nicht sagen was in deiner css steht und wo du es findest. Wir können dir nur den Weg weisen, den Weg auf den man auch selber hätte kommen können.
    Daher nochmals, willst du richtige Hilfe mit klaren Antworten, liefere uns die nötigen Daten und dann findet sich garantiert jemand der gerne hilft

    gruss Benzli


  • Wo muss ich denn normalerweise im CSS nachschauen, damit die Übertragung passt?

    Das ist leider auch sehr individuell. Du kannst das aber mit den Entwicklertools deines Browsers herausfinden (z.B: Firefox -> Rechtsklick -> Element Untersuchen).

  • Die Dinge könnten so einfach sein :-)


    Dafür, wie einfach HTML und CSS aufgebaut sind, sind sie im Team erstaunlich vielseitig. Und dann auch noch alles frei …

    Der Preis dafür: dass man sich eben mit der Materie auseinandersetzen muss.
    (Dann gibt es übrigens auch eine halbe Handvoll oder Handvoll allgemeingültiger „Regeln“, die für unverzerrt skalierte Bilder zur Anwendung zu bringen sind.)

    Wolltest du jetzt wahrscheinlich nicht unbedingt lesen. „Normalerweise“ verkneife ich mir solche Kommentare auch. Aber manchmal geht es einem dann eben doch über die Hutschnur … sorry, meint nicht dich persönlich, ist nur strukturell …

    Gruß
    helix

  • Wie schon gesagt: Klingt nach CSS. Und: CSS. Vielleicht noch: CSS. Falls etwas ohne CSS und in html definiert ist: rofl.

    Vermutung #1 (wo ich nachsehen würde): Schau mal nach sowas wie display:grid, display:flex im css - und: da wird wohl irgendwas statisch/absolut definiert sein.

    Vermutung #2: Autoren-Stylesheets > Benutzer-Stylesheets > Browser-Stylesheets.

  • Ich habe euch mal die passenden Bilder-Passagen auch dem CSS advanced rauskopiert.
    Hoffe ihr könnt damit was anfangen.


    /* Header
    -------------------------------------------------------------- */
    #branding img {
    height: 200px !important;
    display: block;
    width: 100%;
    }


    /* Bilder
    -------------------------------------------------------------- */
    img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img {
    border: 0px !important;
    padding: 6px;
    max-width: 97.5%;
    max-width: calc( 100% - 14px );
    }


    /* CSS-Klassen für Bilder
    -------------------------------------------------------------- */
    .klasse1:hover {
    opacity:0.6;
    }


    Viele Grüße und danke für die z.T. "netten" Kommentare. Ist doch immer wieder erfrischend
    sich so vorführen zu lassen. Alles für den Fortschritt :arrow: :p

  • Ein abgeleitetes twentyeleven Theme also. Was war daran so geheim? oO

    Code
    #branding img {
        height: auto;
        display: block;
        width: 100%;
    }

    // wp-styles.de

  • Hey Leute, ich habe das selbe Problem (Das Bild im Header bei der mobilen Ansicht verzerrt.

    Leider ist mein CSS nicht so übersichtlich wie das des Vorgängers und bevor ich was zerschieße frage ich euch lieber.
    Hier der Code:

    Für Tipps bin ich euch sehr dankbar!

    LG

    Max
    (WP-Noob)

  • Mach am besten bitte einen neuen Thread auf. Das Problem ist zwar ähnlich, da es aber um ein ganz anderes Theme geht, ist das so nicht (immer) vergleichbar. Bitte schreib dann auch gleich einen Link zu deiner Seite mit rein.

  • IchIch mache hier mal zu

    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]

Jetzt mitmachen!

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