1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Buttons auf gleicher Höhe

Dieses Thema im Forum "Design" wurde erstellt von thomasf80, 9. November 2022.

  1. thomasf80

    thomasf80 Active Member

    Registriert seit:
    25. Juli 2016
    Beiträge:
    26
    Zustimmungen:
    0
    Hallo zusammen

    Ich bin seit gut 2 Stunden am googlen und hab die Lösung noch immer nicht gefunden.
    Ich versuche gerade Buttons auf die gleiche Höhe zu bekommen, wie auf dem Bild.

    Mit folgendem Code habe ich jetzt hinbekommen, dass die Boxen alle gleich hoch sind, auch wenn die Texte unterschiedlich lang sind.

    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;

    Box.jpg

    Die Buttons sind aber nicht auf gleicher Höhe. Wie kriege ich das hin, dass die Buttons wie auf dem Bild auf gleicher Höhe sind?

    Vielen Dank im Voraus für eure Hilfe!
     
  2. b3317133

    b3317133 Well-Known Member

    Registriert seit:
    21. November 2014
    Beiträge:
    11.681
    Zustimmungen:
    1.786
    Kommt auf Deinen sonstigen Code an. Link zu Deinen Boxen? Siehe auch Forenregeln, Punkt II.

    Ergänzung: Allgemeines Beispiel: https://jsfiddle.net/2ze586x0/
     
    #2 b3317133, 9. November 2022
    Zuletzt bearbeitet: 9. November 2022
    thomasf80 gefällt das.
  3. thomasf80

    thomasf80 Active Member

    Registriert seit:
    25. Juli 2016
    Beiträge:
    26
    Zustimmungen:
    0
    Vielen Dank für deine Antwort und fürs Beispiel.

    Betreffend Forenregel Punkt 2: Ja sorry, URL macht wenig Sinn. Die Seite ist noch im Wartungsmodus ;)
    Nutze das Theme von Divi und habs jetzt im Feld "Eigene CSS" so gelöst:

    .et_pb_button_module_wrapper {
    bottom: 30px;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    }
    Dazu dann noch den Text oberhalb des Buttons einen Padding von 50px gesetzt.
    Ich weiss nicht, ob das nun die eleganteste Lösung ist, aber auf jeden Fall hat's funktioniert ;)
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden