Bislang wurde ab 992px das Burgelsymbol eingeblendet und das Hauptmenü verschwand.
Mit dem Update auf 4.1.3 wird das Hauptmenü nach wie vor bei 992px ausgeblendet, aber es erscheint dieses Menü
Das verschwindet erst bei 769px und erst dann wird auch das Burgersymbol angezeigt.
Ursache? Lösung?
Moin,
Link zum Problem?
Ansonsten Glaskugel = CSS
Christian
Mit deer 4.1.4 hat sich überhaupt nichts verändert.
Link zum Problem?
Ansonsten Glaskugel = CSS
Link auf unsere Entwicklungsseite ist leider nicht möglich. Aber das würde auch nicht helfen: in diesem Bereich wurde keinerlei CSS-Anpassungen vorgnommen. Hier funktioniert einfach eine Standardfunktion nicht.
Das ist wahrscheinlich noch keinem richtig aufgefallen, da wohl in der Regel nur PC-Display und Smartphone-Display betrachtet werden, weniger aber die Displays von z.B. verschieden großen Tablets.
Ich habe dir ja schon im anderen Thread widersprochen.
Aber das würde auch nicht helfen
Es würde zumindest dir helfen. Als könne man eine Entwicklungsseite nicht trotzdem anzeigen und Bots etc. simpel aussperren...
Zumindest könnten wir dann das nachvollziehen:
Mit dem Update auf 4.1.3 wird das Hauptmenü nach wie vor bei 992px ausgeblendet, aber es erscheint dieses Menü
weil eigentlich verschwindet/erscheint er/es in Cassiopaia ja bei 768 Pixel. Was bei mir auch der Fall ist.
Das ist wahrscheinlich noch keinem richtig aufgefallen, da wohl in der Regel nur PC-Display und Smartphone-Display betrachtet werden, weniger aber die Displays von z.B. verschieden großen Tablets.
Na ja 
Ohne Link zur Seite kann man nicht wirklich helfen. Bei mir erscheint das Hamburger Button bei 991px, also kann dein Problem nicht nachvollziehen.
In der template.css habe ich folgenden Code gefunden.
@media (min-width: 768px) {
.navbar-expand-md .navbar-toggler {
display: none;
}
}Damit düfte klar sein (?), weshalb das Burgersymbol nicht schon bei 991px erscheint. Und in der bootstrap.css steht
@media (min-width: 768px) {
.navbar-expand-md .navbar-collapse {
display: flex !important;
flex-basis: auto;
}
}Das erklärt dann wahrscheinlich, weshalb das Menü schon vorab erscheint ohne eigentlich aktiviert zu sein.
Gelöst habe ich das wie folgt:
@media (min-width: 768px) {
.navbar-expand-md .navbar-collapse:not(.show) {
display: none !important;
}
}
@media (max-width: 991px) {
.navbar-expand-md .navbar-toggler {
display: block !important;
}
}Das mag nicht der eleganteste Weg sein (dafür fehlt mir wohl die notwendige Kennnis). Aber es funktioniert.
Was mich allerdings verwirrt sind folgende Eurer Aussagen
weil eigentlich verschwindet/erscheint er/es in Cassiopaia ja bei 768 Pixel. Was bei mir auch der Fall ist.
Bei mir erscheint das Hamburger Button bei 991px.
Was ist denn nun der richtige Wert? 991px oder 768px? Wo läßt sich das einstellen, wenn überhaupt? Was kann der Grund sein für diese Unterschiede? Bei mir war der Umbruch eigentlich immer bei 992px und hat damit auch bis zur 4.1.2 gut funktioniert.
Die Navigation in Cassiopeia hat navbar-expand-lg, wenn ich mich nicht irre
Was ist denn nun der richtige Wert? 991px oder 768px?
Also wenn ich mir ein « Unveränderte » Cassiopeia anschaue: Cassiopeia
Wird das Hambugermenü erst bei 768 sichtbar und zwischen 768 und 992 ist das Menü Vertikal sichtbar, also unbrauchbar.
Es ist also notwendig die Einstellungen so wie man es gerne möchte in der user.css per media query anzupassen.
Wenn dein Menü so lang ist, dass es nicht in der vorgegebene Breite passt, wird es vertikal. Du kannst ein Override vom collapse Menü machen und navbar-expand-md durch navbar-expand-lg ersetzen
Danke für den Thread, hat mir auch geholfen. Es betrifft genau die iPAD-Ansicht im Hochformat.
Danke für den Thread, hat mir auch geholfen. Es betrifft genau die iPAD-Ansicht im Hochformat.
Was hat dir geholfen ? Was hast du geändert ?
Ich habe diese Zeilen in die user.css meines Child-Templates eingefügt:
Webseite: Sternwarte Ursensollen - Startseite (sternwarte-ursensollen.de)
/*
Bugfix für Cassiopeia Template, so dass Menü bei Tablets im Hochformat als Burgersymbol angezeigt wird
*/
@media (min-width: 768px) and (max-width: 991px) {
.navbar-expand-md .navbar-collapse:not(.show) {
display: none !important;
}
}
@media (max-width: 991px) {
.navbar-expand-md .navbar-toggler {
display: block !important;
}
}
/*
Bugfix für Cassiopeia Template so dass Menü umgebrochen wird, falls es nicht in eine Zeile passt
*/
.container-header .mod-menu {
flex-wrap: wrap;
}
/*
Bugfix für Cassiopeia Template für Back to Top Button, so dass er dauerhaft sichtbar ist
*/
.back-to-top-link {
position: fixed;
}
Übrigens, man braucht kein iPad oder Handy um das Menüverhalten und Responsive Layout zu testen.
Einfach das Browserfenster verkleinern und fertig...
Übrigens, man braucht kein iPad oder Handy um das Menüverhalten und Responsive Layout zu testen.
Einfach das Browserfenster verkleinern und fertig...
Firefox: Strg+Umschalten+M und schon hast du die freie Auswahl.
Bildschirm zusammenschieben ist nicht verlässlich und nur als Anhaltspunkt empfehlenswert.
Übrigens, man braucht kein iPad oder Handy um das Menüverhalten und Responsive Layout zu testen.
Einfach das Browserfenster verkleinern und fertig...
Oder mit F12
kleine Ergänzung:
Inspektor starten mit F12 und dann auf den markierten Button klicken
Na dann wäre dies auch noch was:
