1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Layout iim Responsive-Design verschieden angezeigt

Dieses Thema im Forum "Design" wurde erstellt von Morten12, 20. August 2017.

  1. Morten12

    Morten12 Well-Known Member

    Registriert seit:
    20. April 2014
    Beiträge:
    125
    Zustimmungen:
    0
    Hallo WP-Freunde,

    Ich betreibe einen Blog mit einem selbstgeschriebenen Template. Es sieht so aus als ob die Leser meines Blogs Probleme beim Lesen der Artikel haben, wenn sie den Blog mit ihren Smartphones aufrufen. Zwei verschiedene Text-Divs, die im Blog eigentlich nebeneinander liegen, überlappen sich und auch das Hauptmenü ist weit auseinanderezogen. Wenn ich jedoch über das Entwicklertool im Browser (Chrome, Firefox) den Blog im Responsivedesign anschaue, sieht der Blog auch in der Auflösung kleiner Bildschirme vernünftig aus (wie übrigens auch in jeder anderen Auflösung). Auch auf meinem eigenen Smartphone habe ich keine Problem mit der Darstellung.




    Jetzt weiß ich leider nicht wo ich ansetzten soll, um das Problem zu lösen.
    Ich füge drei Screen Shots als Anhang bei. Die ersten beiden Screen Shoots zeigen die fehlerhafte Darstellung des Blogs auf einem Smartphone. Der dritte Screen Shot zeigt den Blog im Responsive-Design über des Entwicklertool von Firefox (width 280).



    Falls jemand eine Idee hat, bin ich über jeden Ratschlag dankbar.

    Vielen Dank und Liebe Grüße
    Morten
     

    Anhänge:

  2. maxe

    maxe Well-Known Member
    Ehrenmitglied

    Registriert seit:
    1. Mai 2008
    Beiträge:
    19.581
    Zustimmungen:
    277
    ich habe gerade mal mit dem Smartphone (Chrome) drauf geschaut, sieht normal aus, keine Fehler.
     
  3. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Schau mal im Safari-Browser, dann siehst du ganz schnell was los ist.

    Versuch mal deine Media-Queries so zu schreiben:
    @media screen and (max-width:...px){....}

    Du kannst anstatt screen auch all schreiben. Du hast nur @media (max-width:...px){....} geschrieben.

    Außerdem schau mal ob du evtl. irgendwo eine } vergessen hast.
     
  4. Morten12

    Morten12 Well-Known Member

    Registriert seit:
    20. April 2014
    Beiträge:
    125
    Zustimmungen:
    0
    hey, vielen Dank für den Hinweis. Ich probiere es sofort aus! Wäre schön, wenn du noch mal schauen könntest, ob das Layout nun vernünftig aussieht.
     
    #4 Morten12, 6. September 2017
    Zuletzt bearbeitet: 6. September 2017
  5. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Keine Besserung in Sicht.
    Schau mal ob du irgendwo eine { oder } zu viel oder zu wenig hast.
     
  6. Morten12

    Morten12 Well-Known Member

    Registriert seit:
    20. April 2014
    Beiträge:
    125
    Zustimmungen:
    0
    Ich habe auch die Klammern überprüft, aber keinen Fehler finden können. Hast du vielleicht noch eine Idee, wie das Problem zu lösen sein könnte?
     
  7. Morten12

    Morten12 Well-Known Member

    Registriert seit:
    20. April 2014
    Beiträge:
    125
    Zustimmungen:
    0
    Nun habe ich herausgefunden, dass die fehlerhafte Darstellung im Safari-Browser auftaucht. Gibt es besondere Einstellung für Safari, die ich beachten muss, damit mein Blog vernünftig angezeigt wird?
     
  8. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Ich erwähnte sowas bereits .... ;)
    Hilfe ohne in die Materie einzusteigen, finde ich an dieser Stelle schwierig. Vielleicht findet sich jemand in der Jobbörse, der das für kleines Geld erledigt.
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden