nicht angemeldet
Menü-Buttons und Dropdown-Menü überlappen sich
0 
Rolf B
0 0 0 Rolf B
0 
Der Martin
0 Rolf B
0 Der Martin
0 Rolf B
Menü-Buttons und Dropdown-Menü überlappen sich
Hallo zusammen,
ich schreibe zum ersten Mal in diesem Forum und hoffe, dass ich soweit mit meinem neuen Thread alles richtig mache.
Ich bekomme auf der Seite http://gms-lam.de/ ein Problem nicht gelöst. Wie in der Überschrift genannt, überlappen sich die Menü-Buttons und das Dropdown-Menü. 
Mit dem Firefox-Browser-Developer habe ich schon an den CSS-Befehlen herumgeschraubt, aber ich bin noch zu keiner richtigen Lösung gekommen.
Ich vermute die zu bearbeitenden Zeilen liegen in der template.css zwischen Zeile 549 und 634 und/oder zwischen 1447 und 1492.
Ich habe z.B. unter Zeile 1478 schon versucht, es mit einem z-index über 900 zu lösen, weil ja in Zeile 551 für das Menü ein z-index von 900 eingetragen ist.
Wäre prima, wenn mir jemand weiterhelfen könnte.
Viele Grüße
-
Hallo Metallmonster,
du legst den ganzen Module-Content auf einen Z-Index von 900 oder 901. Was innerhalb des Moduls passiert, wird davon nicht beeinflusst.
Es gibt mehrere CSS Eigenschaften, die Stapelkontexte erzeugen können. Die z-index Eigenschaft beeinflusst Stapelkontexte, nicht HTML Elemente. Folge mal beiden Links und lies Dir das durch.
Ohne Stapelkontext werden die Elemente einfach übereinander gelegt. Wer zuletzt kommt, liegt obendrauf. Die Submenüs von früher definierten <li> liegen deshalb in der Stapelreihenfolge unterhalb von später definerten <li>. Da dein Menü zweizeilig ist, schieben sie sich unter die <li> der zweiten Zeile.
Die Lösung ist ein
z-index:1für die Popup-Menüs (class="jsn-submenu-level-1"). Damit bekommen sie einen neuen Stapelkontext und können über den <li> des Elternkontextes liegen.Rolf
--
sumpsi - posui - obstruxi-
Hallo Rolf,
vielen Dank für deine umgehende Antwort und Hilfe. Es klappt...allerdings nur kurz. Wenn ich diese Zeilen im Developer - also wenn ich die Codes der Webseite mit F12 öffne - ergänze, funktioniert das Ganze:
[class="jsn-submenu-level-1"] { z-index: 1 }
Aber nur so. Sobald ich diese Zeilen dann in der template.css ergänze, speichere, ist die Änderung weg, obwohl der Befehl vorhanden ist, also er wird auch im Firefox-Developer angezeigt. Das würde für mich jetzt bedeuten, ich verwende mit Sicherheit die richtige css-Datei, aber mit der template.css funktioniert der Befehl nicht..
Wenn ich dann die entsprechenden Zeilen im Developer lösche und erneut einfüge, klappt es wieder...
Kurzgefasst: Im Developer klappt's, mit der template.css aber nicht...
Woran liegt denn das nun wieder?
Viele Grüße
-
Nur noch kurz als Anmerkung den Joomla-Cache habe ich geleert.
-
Hallo Metallmonster,
möglicherweise hat dein Browser noch die alte .css Datei im Cache. Wenn ich deine Seite aufrufe, sieht es richtig aus.
Drück mal Strg+F5 (full refresh)
Rolf
--
sumpsi - posui - obstruxi-
Hallo,
möglicherweise hat dein Browser noch die alte .css Datei im Cache.
aber würden dann nicht die Developer Tools auch die alte Version anzeigen?
Live long and
proshealthy,
Martin--
Home is where my beer is.-
Hallo Martin,
wenn man das in den Developer Tools hineineditiert, nicht. Auf diese Weise habe ich auch schon einige Experimentier-Ergebnisse verloren. Muss man dann dran denken. In den DT Strg+A und Strg C, im Editor Strg+A und Strg V (aber BITTE in der richtigigen Datei 😂)
Man kann aber - andere Idee - im Netzwerktab der Tools das Caching abschalten. Das hilft auch gegen veraltete Quelllen.
Rolf
--
sumpsi - posui - obstruxi-
Hallo Rolf,
wenn man das in den Developer Tools hineineditiert, nicht.
natürlich nicht, aber Metallmonster schrieb doch, er/sie habe das erst in den Developer Tools ausprobiert, dann im Quellcode korrigiert und die Seite neu geladen. Danach sei die Änderung (wieder) im Developer Tool sichtbar gewesen. Aber trotzdem wirkungslos.
Man kann aber - andere Idee - im Netzwerktab der Tools das Caching abschalten. Das hilft auch gegen veraltete Quelllen.
Ich habe mal irgendwo aufgeschnappt, beim Öffnen der Developer Tools würde der Cache automatisch temporär deaktiviert. Wahrheit oder Märchen?
Live long and
proshealthy,
Martin--
Home is where my beer is.-
Hallo Martin,
hm, vielleicht hab ich nicht richtig verstanden was Kollege Roboter gemacht hat. Caching ist jedenfalls der Hauptgrund, warum Änderungen nicht im Browser erscheinen. Wenn serverseitig auch noch gecached wird, hilft das natürlich nichts, dagegen hilft dann nur ein cache buster. Sofern der bei Joomla machbar ist, heißt das.
Zu den Developer Tools:
Wahrheit oder Märchen?
Ja.
Bilder einbinden streikt bei mir gerade. Aber es gibt eine Checkbox auf dem Netzwerk-Tab, mit der Du das einstellen kannst.
Rolf
--
sumpsi - posui - obstruxi-
Hallo Rolf, hallo Martin,
passt alles! Es muss tatsächlich am Browser-Cache gelegen haben... Obwohl du recht hattest, Martin. Der Code wurde nach Aktualisierung der template.css im Developer angezeigt, aber die Änderung im Firefox selbst nicht. Komisch, aber egal. Es hat geklappt.
Strg + F5 ist ein Full Refresh, der auch den Browser Cache aktualisiert... und schon wieder was gelernt.;-) Das ging als eifriger F5-Nutzer trotzdem bisher an mir vorbei...
Nochmals danke und viele Grüße
P.S.: Das Metallmonster ist übrigens männlich. Damit wäre das auch geklärt... 😉
-
-
-
-
-
-
-