Как центрировать выравнивание текста по вертикали?

Question

У меня есть этот сайт:

http://avocat2.dac-proiect.ro/?page_id=21

Как вы можете видеть, что мой текст не выровнен по вертикали, как это должно быть. Я хотел бы быть ниже, а так же для всех разрешений

Это код HTML:

<div class="entry-content2"> 

<div class="gigi"> 

    <div class="row"> 
    <div class="col-sm-12 col-md-12 col-lg-12 style=" "=""> 
     <img src="wp-content/themes/WordPressBootstrap-master/images/LOGOb.png" class="img-responsive center-block" style="min-width:156px;min-height:83px"> 
    </div> 
    </div> 
</div> 
     <div class="container-fluid aliniere"> 
<p class="text-center" style="color:white;font-size:17px;padding-left:50px;padding-right:50px;padding-top:20px;padding-bottom:20px;">Am reprezentat şi am acordat consultanţă juridică pentru clienţi persoane fizice române şi străine, instituţii publice, persoane juridice române şi străine în următoarele domenii:</p> 
<div class="row sss"> 
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-2" style="font-size:17px;color:white;"> 
<p class="text-left">Drept civil<br> 
– agricultură, exploatări agricole, prelucrarea şi comercializarea produselor agricole;<br> 
– comerţ cu produse alimentare;<br> 
– imobiliar;<br> 
– distribuţie de carburanţi;<br> 
– transporturi;<br> 
– asigurări;<br> 
– producţie şi comercializare utilaje grele;<br> 
– producţie structuri metalice;<br> 
– design, fotografie, artă; 
</p> 
<p></p></div> 
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;"> 
<p class="text-left">Drept administrativ<br> 
– producţie automatizări;<br> 
– servicii de proiectare;<br> 
– comercializare automatizări;<br> 
– jocuri de noroc;<br> 
– turism, hoteluri şi pensiuni;<br> 
– medical;<br> 
– construcţii civile şi industriale;<br> 
– comercializare utilaje şi autovehicule, service auto;<br> 
– producţie software, administrarea site-urilor; </p> 
<p></p></div> 
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;"> 
<p class="text-left"> 
– comerţ;<br> 
– bursier, societăţi listate, investitori, fonduri de investiţii;<br> 
– asistenţă şi îngrijire copii şi vârstnici;<br> 
– exploatări forestiere şi prelucrarea lemnului;<br> 
– extracţia şi prelucrarea minereurilor;<br> 
– producţia şi comercializarea materialelor de construcţii;<br> 
– instituţii publice;<br> 
– instituţii religioase.</p> 
<p></p></div> 
<p></p></div> 
</div> 
    </div> 

Можете ли вы помочь мне решить эту проблему?

Я нашел этот пример, но мы не реализовали его, и поэтому я назвал помощью вашего

http://jsfiddle.net/v5tc0ga3/

Спасибо заранее!

Answer 1

Вы можете использовать дисплей: стол; на вашем родительском контейнере и дисплей: table-cell для элементов детей, которые должны быть выровнены по вертикали.

Также дисплей: стол; очень хорошо поддерживается кросс-браузер:

http://caniuse.com/#feat=css-table

body,html{ 
    height:100%; 
} 

div { 
    width: 250px; 
    height:100%; 
    display: table; 
    text-align: center; 
    border: 1px solid #123456; 
    margin-bottom:5px; 
} 
span { 
    display: table-cell; 
    vertical-align: middle; 
    line-height: normal; 
} 

JSFIDDLEhttp://jsfiddle.net/a_incarnati/v5tc0ga3/83/

Answer 2

В CSS мы имеем что-то другое при работе с таблицами, где имеют свойство vertical-align. если вы можете изменить отображение элементов, вы можете сделать это поведением, как ячейка таблицы, где он может быть выровнен по вертикали.

Здесь проверить эту ссылку: https://css-tricks.com/centering-in-the-unknown/

.something-semantic { 
    display: table; 
    width: 100%; 
} 
.something-else-semantic { 
    display: table-cell; 
    text-align: center; 
    vertical-align: middle; 
} 

это всегда центр по вертикали текст.