WannaBeDev
WannaBeDev

Reputation: 47

Bootstrap row vertical align

can anybody tell me how to vertical align the row in bootstrap ?

<div class="container">
    <div class="row">
        <br>
        <div class="col-sm-6">
            <div class="carousel-content centered">
                <h1 class="animation animated-item-1" style="color:black">Dream Banking</h1>
                <h3 class="animation animated-item-2" style="color:black">Beneficiati de toate avantajele Dream Banking chiar acum !!!</h3>

            </div>
        </div>
        <div class="col-sm-6 hidden-xs animation animated-item-4">
            <div class="centered">
                <div class="jumbotron">
                    <p>Bun venit pe site-ul Dream Banking. Acesta este un site pentru oricine doreste sa-si gestioneze veniturile intr-un mod cat mai eficient. Aici veti putea beneficia de o serie de ustensile cu care va veti gestiona cat mai bine posibil proprii bani. Totodata, veti putea transfera bani din contul personal catre oricare alt cont logat pe acest site. Pentru inceput tot ceea ce trebuie sa faceti este sa va creati un cont pe acest site accesand butonul de login din partea dreapta a ecranului, ulterior pe butonul Don't have an account!.</p>
                </div>
            </div>
        </div>
    </div>
</div>

thi is my row and i would like to vertical align those cols because i use a fullscreen carousel and i would like to be vetical aligned :). i hope that somebody can help me. cheers !

Upvotes: 0

Views: 347

Answers (1)

Hern&#225;n Giraldo
Hern&#225;n Giraldo

Reputation: 146

If you need to align the "row" in the "container":

I would add another class to the "cointainer" div:

.flex-container {
  width: 500px;
  height: 500px;
  background: green;
  display: flex;
  flex-direction: column;
  align-items: center; //horizontal align
  justify-content: center; //vertical align
}

Codepen: flex-cointainer

Upvotes: 1

Related Questions