Das Menü Objekt verschluckt in der Smartphone-Auflösung eine Zeile von Einträgen 
Autor: Juergen S.
Besucht 1028,
Followers 1,
Geteilt 0
Ich habe das Menüobjekt für Tablets und Smartphones geschickt an den oberen Rand der Seite verlagert, während es bei Desktop Ansicht an der Seite ist. Prima!
Aber obwohl es keinen Grund dafür gibt (siehe Bild), zeigt es jetzt die ersten 3 Einträge nut in der Tablet-View an, aber in der Smartphone-Ansicht fehlt die erste Zeile und ein Hamburger erscheint, ohne dass ein Grund vorliegt. Die ersste Zeile ist noch nicht einmal die längste Zeile.
Vielleicht reicht der Platz wegen dem Hamburger nicht, aber der wäre ohnehin nicht nötig gewesen. Und außerdem hätte das Objekt ja nach unten wachsen, und dem Hamburger eine eigene Zeile geben können.
Frage also: Was tun?
8:o|
Gepostet am
Autor
Mist, das war das falsche Bild. Hier kommt das richtige.
8:o(
Wie lang hast du das MEnü-OBjekt gemacht oder gezogen? Es müssten sich die 3 MEnüpunkte ausgehen, damit es diese auch anzeigt. Natürlich beim Breakpoint von 480px ändern.
Autor
Wenn ich das richtig verstehe, meinst Du wieviele Zeilen?
Das Menü Objekt geht über die ganze linke Spalte bis unten, also 8 Zeilen, und ist in der Responsiven Ansicht sichtbar, auf Pos. 1 und es hat einen Zeilenumbruch bekommen...
Wenn ich den Wert für Max. Einträge pro Spalte im Menüobjekt auf 6 setze, sieht es für Smartphones noch seltsamer aus, d.h. jetzt fehlt noch mehr (siehe Bild).
8:o|
Du hast oben und unten noch Platz! Ziehe das Objekt nach oben und unter ergänze es auf die ganze Höhe des Headers.
Wenn dann immer noch die 3 Striche ('Hanmburgermenü) auftauchen, musst du den Header in der Höhe anpassen.
Autor
Im Heaader ist viel Platz, aber egal.
Das Menü-Objekt hier ist NICHT im Header, es ist in der linken Spalte der Seite.
Siehe Bild.
In der responsiven Ansicht steht's auf Nr. 1 und hat hiner sich einen Zeilenumbruch, und somit ab Tablet-View und auch im Smarttphone View die oberste Zeile allein für sich.
Im Tablet View funktioniert die Sache: Das Objekt steht ganz oben und enthält alle Punkte in mehreren Spalten.
Autor
Man müsste vielleicht noch erwähnen, dass vor dem Menüpunkt "Abschlussprüfung erwünscht?" eine Menütrennlinie ist, die ich aber aber dem Tablet-View per CSS auf width 0px gesetzt habe, weil sie nur in der Desktop Ansicht, wenn alle Punkte in einer Spalte untereinader stehen, brauchbar aussieht. Aber ich denke nicht, dass das ein Problem ist, denn das habe ich in Version 12 auch gemacht, und alles hat bestens funktioniert. In Version 13 ging garnichts ....
8:o|
Autor
Guten Tag,
Nach den letzten Breakpoint ist dieser immer als Hamburgemenü dargestellt. Sie können den letzten Breakpoint ändern auf eine kleinere Breite damit dieser nicht sofort als Hamburgemenü dargestellt wird.
Vielen Dank!
Autor
Danke für die Antwort.
... wenn das so ist, warum werden dann die einige Menüpunkte dargestellt?
Es fehlt nämlich nur ein Teil der Menüpiunkte. Ist das nicht unlogisch?
Dann solltest du noch einmal deine Brakpoints durchgehen. Es ist möglich, dass die Breiten der Felder für das Menü nicht passen.
Ist die letzte Ansicht -480px ? Wenn ja, dann blendet es automatisch um auf mobiles Menü! (was auch so gewollt ist)
Deshalb der Vorschlag von Claudio z.B. einen Breakpoint mit 320px einzufügen.
Autor
Hallo,
jetzt habe ich einen zusätzlichen Breakpunkt bei 320, aber für Smartphones bis 320px bleibt das Problem wie gehabt bestehen:
Es ist eine seltsame Mischung aus Hamburger und den letzten beiden Menüpunkten (siehe Bild). Wie bekomme ich die nun noch weg?
Oder soll das so sein?
8:o|
Autor
... und wenn ich den Hamburger öffne, dann sind da auch nur die zwei letzten Menüpunkte.
ICh glaube kaum dass noch einer unter 320px ein HAndy hat. Das müssten dann NOKIA Handy sein.
Autor
Sagen wir mal ja, aber eine saubere Programmierung ist das nicht...
Danke.
8:o|
Autor
... vielleicht gibt's doch eine echte Lösung, die auch mit NOKIA Smartphones funktioniert?
8:o/
Guten Tag,
Haben sie schon veruscht den letzten Breakpoint zu verkleinern?
Vielen Dank!