S
S
sergemin2017-03-13 19:12:14
Bootstrap
sergemin, 2017-03-13 19:12:14

How to vertically align blocks in Bootstrap?

I edited the site, added Bootstrap. Everything seems to be fine, but the blocks are not aligned vertically. I decided to add flex-box, but as it turned out, flexes do not work with bootstrap (adaptability stops working).
Please tell me how to implement vertical alignment. Only I'm only interested in the bootstrap option. I have no desire to redo the layout because of one block.
The code is something like this:

<div class='container'>
   <div class='row'>
        <div class='col-lg-4 col-md-4 col-sm-4 col-xs-4'>loremloremloremloremloremloremloremloremloremloremloremloremlorem</div>
        <div class='col-lg-4 col-md-4 col-sm-4 col-xs-4'>loremloremlorem</div>
        <div class='col-lg-4 col-md-4 col-sm-4 col-xs-4'>loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlorem</div>
   </div
</div>

Answer the question

In order to leave comments, you need to log in

2 answer(s)
S
Sergey delphinpro, 2017-03-13
@sergemin

<div class='container'>
   <div class='row specific-block'>
    ...
   </div
</div>

.specific-block {
  display: flex;
  align-items: center;
}

.specific-block {
  >div {
    display: table-cell;
    vertical-align: center;
  }
}

S
sim3x, 2017-03-13
@sim3x

vertical-align
line-height

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question