Trennerabstände

  • Gelöst koala150

    (@koala150)


    vor 4 Tagen, 17 Stunden

    Hallo,

    in der mobilen Ansicht meiner Internetseite sind die Trenner der einzelnen Menüpunkte (besonders vertikal) unnötig weit auseinander, mit den Abstandseinstellungen des Off-Canvas-Menüs bekomme ich das nicht eingestellt. Es scheint so, dass Astra unter bestimmten Bedingungen einen Mindestabstand erzwingt. Hat jemand eine Idee, wie man diesen Abstand reduzieren kann.

    VG, Sven

    PS: leider finde ich keine Möglichkeit hier einen SC anzuhängen, um besser darstellen zu können, was ich meine

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 11 Antworten – 1 bis 11 (von insgesamt 11)
  • bscu

    (@bscu)

    vor 4 Tagen, 16 Stunden

    PS: leider finde ich keine Möglichkeit hier einen SC anzuhängen

    Siehe Wie kann man hier Bilder in einen Forenbeitrag einfügen?

    Thread-Starter koala150

    (@koala150)

    vor 4 Tagen, 16 Stunden

    Danke

    https://drive.google.com/file/d/1b3EFPDp1OenJpk74KrIit4jCcu8d7RDp/view?usp=sharing

    https://drive.google.com/file/d/1dyQyu2-VZCJw01APnBqw8gZM_0b-UmCC/view?usp=sharing

    Moderator threadi

    (@threadi)

    vor 4 Tagen, 14 Stunden

    Du hast ganz schön viel individualisiertes CSS im Einsatz. Ergänze hier

    @media (max-width: 921px) {
      /* 1. POSITION-FIX (wichtig - bleibt!) */
      .ast-mobile-popup-drawer,
      .ast-builder-menu-mobile .main-header-menu {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 300px !important;
        height:100vh !important;
        z-index: 9999 !important;
        transform: translateX(0%) !important;
        overflow-y: auto;
      }
    }

    mal noch die Eigenschaft:

    display: block;

    Dadurch wird aus dem Flex-Element (was die Höhe verursacht) ein Block-Element. Dadurch verschwindet die Höhe. Allerdings sieht es dann noch nicht ganz hübsch aus. Du hast auch die Pfeile in dem Menü mit individuellem CSS positioniert. Das müsstest du nochmal anpassen.

    • Diese Antwort wurde vor 4 Tagen, 14 Stunden von threadi geändert.
    Thread-Starter koala150

    (@koala150)

    vor 4 Tagen, 14 Stunden

    besten Dank, ich hab von den sachen eh keine Ahnung, ich mach nur das was KI mir sagt. ;-))) aber das hat sie eben auch nicht hinbekommen, stattdessen steht da jetzt sicher viel unnützes zeug drin, was ich aber nicht einfach löschen will, weil ich nicht weiß, was das für nebenwirkungen auslösen kann.

    LG,
    sven

    bscu

    (@bscu)

    vor 4 Tagen, 14 Stunden

    ich mach nur das was KI mir sagt

    Keine gute Idee, man sollte zumindest so halbwegs verstehen, was die KI liefert. Alles andere endet sonst irgendwann im Chaos. 😉

    Thread-Starter koala150

    (@koala150)

    vor 4 Tagen, 14 Stunden

    es is wie verhext, einstellen kann ich den trennerabstand immer noch nicht, jetzt kann ich zwar die kleinen Pfeile rechts in ihrer Position verändern, bringt aber für die gesamthöhe nix

    aber dafür, dass ich nur das mache, was KI mir sagt und eigentlich keine ahnung habe, bin ich mit meinen seiten (sternenrost.de) ganz zufrieden ;-)), die seitenaufrufe bestätigen das ja auch ein wenig.

    Moderator La Geek

    (@la-geek)

    vor 4 Tagen, 11 Stunden

    Dieser CSS-Code sollte es beheben:

    @media (max-width: 921px) {
	.ast-mobile-popup-drawer, .ast-builder-menu-mobile .main-header-menu {
		height: auto !important;
	}
}

    Nachtrag, Bonus-Tipp
    Füge außerdem noch diesen Code hinzu, ganz ans Ende in einer neuen Zeile, damit die Buttons „zum Anfang/aktuellen Fall“ das mobile Menü nicht überlappen

    a.akte-latest-button-fixed, 
a.akte-button-fixed {
    z-index: 1;
}

    CSS-Code kann man
    1.) Wenn kein Child-Theme vorhanden ist
    im WordPress-Backend >> Design >> Customizer >> zusätzliches CSS (ganz ans Ende in einer neuen Zeile) einfügen.

    Abgekürzter Weg -> (dein-domainname.de/wp-admin/customize.php), also:

    /wp-admin/customize.php an deine Domain anhängen >>, aufrufen und dann auf zusätzliches CSS klicken, das funktioniert auch (noch?), wenn du unter dem Menüpunkt Design kein „Customizer“ mehr findest.

    2.) Wenn du ein Child-Theme verwendest,
    dann trage stattdessen den CSS-Code in die Datei style.css ganz ans Ende in einer neuen Zeile ein.

    Nach dem Abspeichern musst du den Browsercache leeren, drücke dafür CTRL (STRG) + SHIFT + Entf gleichzeitig, dadurch wird in den gängigen Browsern ein Fenster zum Löschen geöffnet (weitere Hilfe dazu). Auf einem Smartphone musst du natürlich den Browser-Cache anders entfernen.

    Solltest du ein Cache-Plugin installiert haben, leere auch diesen Cache. Nun teste auf der Seite, ob du eine Änderung siehst.

    Thread-Starter koala150

    (@koala150)

    vor 4 Tagen, 10 Stunden

    Danke, aber das nutzt nix, denn damit kann ich das aufgeklappte Menü nicht mehr scrollen, wenn ich z. B. ein langes untermenü aufgeaklppt habe.

    Moderator La Geek

    (@la-geek)

    vor 4 Tagen, 9 Stunden

    Das konnte ich reproduzieren, hier ist der neue CSS-Code

    @media (max-width: 921px) {
	.ast-mobile-popup-drawer, .ast-builder-menu-mobile .main-header-menu {
		height: auto !important;
		max-height: 100vh !important;
	}
}
a.akte-latest-button-fixed, 
a.akte-button-fixed {
    z-index: 1;
}
    Thread-Starter koala150

    (@koala150)

    vor 4 Tagen, 7 Stunden

    juhhu, jetzt passt´s, prima und herzlichen Dank, genauso hab ich mir das vorgestellt. Perfekt! :-))

    sorry, dass ich etwas länger gebraucht habe zu reagieren, bin grad nach mit ner andern sache beschäftigt.

    Moderator La Geek

    (@la-geek)

    vor 4 Tagen, 7 Stunden

    Gerne 🙂 Danke für die Rückmeldung und das Setzen des Threads auf gelöst.

Ansicht von 11 Antworten – 1 bis 11 (von insgesamt 11)

Du musst angemeldet sein, um auf dieses Thema zu antworten.