Mobile Navigation Probleme Dawn Theme

Topic summary

Ein Nutzer hat die mobile Navigation im Dawn Theme auf 80% Breite angepasst, wodurch Menüpunkte mit Unterpunkten nicht mehr korrekt angezeigt werden.

Technisches Problem:

  • Nach der CSS-Anpassung der Navigation-Breite werden Untermenü-Elemente verschoben und sind nicht mehr sichtbar
  • Das Problem tritt nur auf mobilen Geräten auf, Desktop ist nicht betroffen
  • Beim Entfernen des Codes verschwindet das Problem, aber auch die gewünschten CSS-Dekorationen (Linien, Padding)

Lösungsansätze & Diskussion:

  • Vorschlag: CSS-Code für Untermenüs anpassen und .submenu-Klassen berücksichtigen
  • Media Queries und Viewport-Tags überprüfen
  • Problem wurde auch im englischen Forum gepostet

Aktueller Stand:

  • Das Problem liegt definitiv am hinzugefügten Code
  • Aufgrund der Breitenverengung werden <li>-Child-Elemente verschoben
  • Ein Experte (PageFly-Richard) wurde empfohlen, da Platzverhältnisse einen “Dominoeffekt” auf andere Menü-Elemente verursachen
  • Vorschlag: PageFly App nutzen oder professionelle Hilfe für die Umsetzung in Anspruch nehmen

Status: Ungelöst, weitere Expertenberatung empfohlen

Summarized with AI on November 11. AI used: claude-sonnet-4-5-20250929.

Hey @yzarda

Ja ich sehe was da passiert. Passiert das auch in einer frischen Kopie des Dawn Themes dass du von Theme Store downloadet? Wenn nicht, dann liegt es an der Codeänderung die ihr ausgeführt habt.

Es könnte sein, dass bestimmte Skripte oder Stylesheets nur auf Desktop-Ansichten korrekt geladen werden und mobile Ansichten ausschließen, oder dass bestimmte Skripte oder Stylesheets nur auf Desktop-Ansichten korrekt geladen werden und mobile Ansichten ausschließen. Manchmal werden Elemente für mobile Ansichten absichtlich versteckt, um eine bessere Benutzererfahrung zu bieten oder Überfüllung zu vermeiden.

Überprüfe, ob es Klassen wie hidden-mobile oder ähnliche gibt, die die Anzeige auf mobilen Geräten verhindern könnten. Stelle sicher, dass dein HTML-Dokument ein korrekt konfiguriertes Viewport Meta-Tag enthält, welches für die korrekte Skalierung und Anzeige auf mobilen Geräten sorgt. Ein fehlendes oder falsch konfiguriertes Viewport Tag kann zu Anzeigeproblemen führen.

Überprüfe auch die Media Queries in deinem CSS, um sicherzustellen, dass sie korrekt für die Anzeige auf mobilen Geräten konfiguriert sind. Media Queries ermöglichen es dir, unterschiedliche Styles basierend auf der Bildschirmgröße oder anderen Merkmalen des Anzeigegeräts anzuwenden.

Hoffe das hilft dir weiter - lass wissen falls nicht! :wink: