垂直中心多条线

我需要垂直居中li的内容，所以我做的是lineheight，它的工作原理是，但问题是，当我有多条线时，这种技术不再有效，我can't modifyhtml因为它是这是教授给出的一个约束。所以我真的用尽了解决方案。垂直中心多条线

这里是HTML而且Css

li 
 
    { 
 
    
 
     
 
    \t list-style-type:none; 
 
    \t border-bottom: 1px solid #e0e0e0; 
 
    \t height: 55px; 
 
    \t display: inline-block; 
 
     vertical-align: middle; 
 
     width: 100%; 
 
     line-height: 55px; 
 
    
 
    } 
 
    ul 
 
    { 
 
    \t list-style : none; 
 
    \t 
 
    }

<ul> 
 
    \t <li> 
 
      The 2015–16 UEFA Champions League was the 61st season of Europe's premier club football tournament organised by UEFA, and the 24th season since it was renamed from the European Champion Clubs' Cup to the UEFA Champions League 
 
      
 
     </li> 
 
    
 
    </ul>

来源

2016-05-31 Brandon Jose

垂直对齐方式？ –

是垂直对齐 –

您必须使用其他4或5种技术之一来垂直居中您的内容。他们都很好地覆盖了许多关于SO的问题。 – Alohci

.parent { 
 
    display: table; 
 
    height: 260px; 
 
    width: 180px; 
 
    padding: 10px; 
 
    border: 2px solid darkgray; 
 
} 
 
.parent li { 
 
    border:1px solid blue; 
 
    display:  flex; 
 
    vertical-align: middle; 
 
    padding:8px; 
 
}

<ul class="parent"> 
 
    <li>Something about Footbal</li> 
 
    <li>Something about Footbal</li> 
 
    <li>Something about Footbal</li> 
 
</ul>

子元素是关系到他父母的财产display的位置。如果父母有display:table，孩子将有display:table-cell和vertical-align:middle。

我们有更多的例子here也here

来源

2016-05-31 13:13:44 Andrei

那么只需复制粘贴在其他问题中看到的答案？ – dippas

重复是所有学习的母亲:) – Andrei

有一件事是重复的，另一件事是复制粘贴代码。 – dippas

垂直中心多条线

回答

相关问题