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

您可以在父容器上使用 display：table; ，并将 display：table-cell 用于需要垂直对齐的子元素。

同时显示：table;非常支持跨浏览器：

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;
}

JSFIDDLE http://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;
}

这将始终垂直居中于您的文字。

如何垂直居中对齐文字？

2 个答案: