CSS-Problem bei Darstellung auf IPhone

    Hallo Zusammen,

    benötige mal etwas Hilfe, da ich gerade auf dem Schlauch stehe.

    Es dreht sich um den Inhalt folgender Seite (genauer gesagt um die Speisekarte):
    https://tinyurl.com/yc55qnhn

    Wenn man sich die Speisekarte auf einem Android-Gerät betrachtet, wird diese wie gewünscht dargestellt. Das bedeutet von der Reihenfolge her:
    - Speisename und Preis
    - Erklärung / Beschreibung des Gerichts

    Bei der Ansicht auf dem iPhone sieht das Ganze leider etwas anders aus:
    - Speisename
    - "." + Preis
    - Erklärung / Beschreibung des Gerichts

    (siehe dazu auch Grafiken anbei).

    Danke für Eure Unterstützung.

    WordPress Service & Support

    • Gerade eben
    • 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

    Versuch mal Media all and (max-width:480px) anstatt nur Media (max-width:480px)

    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]

    Schau mal in der custom.css ob da zufällig irgendwo eine { oder } fehlt oder zu viel ist.

    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]

    Das Problem könnte der fixe Wert für margin-right sein (Zeile 49 des Custom CSS):

    Code
    body.page-id-514 .thim-list-menu-wrapper .item .desc .name .price {
    float: right;
    line-height: 21px;
    [COLOR=#ff0000]margin-right: -70px;[/COLOR]
    margin-top: 1px;
    padding-left: 0;
}

    Ansonsten ist das Angebot lecker! :p

    Einmal editiert, zuletzt von Edi (29. August 2017 um 14:42)

    Also Edi reproduzierbar ist die fehlerhafte Darstellung auf iPhone 4s, 6, 6s und 7. Zumindestens sind das die Geräte auf denen wir reproduzieren konnten bzw. erfragt haben. Weitere nicht augeschlossen. Nach der geschweiften Klammer habe ich gesucht, aber da scheint mir alles in Ordnung zu sein. Der fixe Wert für margin-right sorgt dafür dass der Preis mit entsprechendem Abstand vom rechten Rand angezeigt wird. Habe es zwar gerade eben mal temporär entfernt, es gab aber keine Änderung außer dass der Preis selbst mehr in die Mitte gerückt ist.

    WordPress Service & Support

    Zitat von forcemedia

    Der fixe Wert für margin-right sorgt dafür dass der Preis mit entsprechendem Abstand vom rechten Rand angezeigt wird.

    Im Browser kann ich den Fehler so reproduzieren. Er kann aber auch eine andere Ursache haben. Nur: 70 Pixel sind bei einer Screen-Breite von beispielsweise 320 Pixel eine ganze Menge... Kommt dazu, wie die "Tabelle" konstruiert ist.

    Da es sich beim Theme um ein Kauf-Theme handelt: Warum fragt Ihr nicht dort nach? Mit dem Kauf wird normalerweise auch für den Support bezahlt. Und irgendwelche Fehler für etwas, mit dem andere Geld verdienen, kostenlos nachzubessern, macht mässig Spass. ;-)

    Die 70px sind nicht das Problem. Man kann es sehr gut auch am PC reproduzieren, allerdings nur mit dem Safari. Dort werden alle CSS-Angaben gezogen, aber die media-queries nicht bzw. nur der Inhalt ohne das Media. Scheint also ein Safari-Problem zu sein. Nur mit Ferndiagnose ist es daher schwer den Fehler zu finden. Daher mach es wie Edi sagt, frag beim Theme-Autor nach.

    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!

Benutzerkonto erstellen Anmelden