Bootstrap - Inhalte vertikal ausrichten

Thema wurde von KlausUndSo, 6. April 2019 erstellt.

  1. KlausUndSo
    KlausUndSo Erfahrener Benutzer
    Registriert seit:
    4. November 2018
    Beiträge:
    66
    Danke erhalten:
    1
    Danke vergeben:
    18
    Hallo,

    die Frage lautet, wie kann ich Inhalte von DIV-Containern vertikel ausrichten, zum Beispiel zentrieren, so dass zwei nebeneinander liegende Div-Container bzw. deren Inhalt nicht oben kleben, sondern schön mittig nebeneinander liegen?

    Beispiel:

    <div class="row">
    <div class="col-xs-12 col-md-6">
    <p>
    Text
    </p>
    </div>

    <div class="col-md-1">
    &nbsp;
    </div>

    <div class="col-xs-12 col-md-6">
    Bild
    </div>
    </div>

    Die Frage bezieht sich nur auf alles ab "col-md" auf kleineren Bildschirmen sollen Bild und Text übereinander, was auch hinhaut.
    Da der Text kürzer ist als das Bild hoch, klebt der Text an der oberen Kante der Zeile. Ich hätte den aber gern vertikal zentriert neben dem Bild. Geht das irgendwie und wenn ja, wie?

    Beispielseite: https://klausundso.de/info/manufakturwarenladen.html
     
  2. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Vielleicht hilft das:
    (Link nur für registrierte Nutzer sichtbar.)
     
  3. KlausUndSo
    KlausUndSo Erfahrener Benutzer
    Registriert seit:
    4. November 2018
    Beiträge:
    66
    Danke erhalten:
    1
    Danke vergeben:
    18
    Da benötige ich noch etwas Hilfe. CSS ist nicht meine Stärke!
    Wo kommt der Teil hin:

    DIV.container {
    min-height: 10em;
    display: table-cell;
    vertical-align: middle }

    ?
     
  4. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    ins eigene css im Style Editor.