Question

我不能在这个里面对所有3个div进行垂直对齐。我也尝试过div，但没有。我该怎么办？

<li style="list-style:none;border-bottom:1px solid white;height:60px;background-color:blue;padding-left:5%;padding-right:5%">
  <div style="max-width:39%;min-width:39%;display:inline-block;;vertical-align:middle;text-align:right">
    Equipo 1
  </div> 
  <div style="max-width:19%;min-width:19%;display:inline-block;vertical-align:middle;text-align:center">
    18/05<br>12:30
  </div> 
  <div style="max-width: 38%;min-width: 38%;display:inline-block;vertical-align:middle">
    Equipo 2
  </div>
</li>

Demo

由于

Answer 1

你需要一个内联框来适应父级的高度，所以其他人将垂直对齐它。

您可以使用伪元素生成此元素，该元素将用作vertical-align的参考： DEMO

li:before {
    content:'';
    display:inline-block;
    height:100%;
    vertical-align:middle;
}

<edit> playground pen for line-height </edit>

垂直对齐3个div与内联块

1 个答案: