CSSテーブルの最大高さを設定する方法は？

Question

私はこの資料に記載されている方法を使用してdivの中垂直方向に中央のテキストにしようとしている：ここhttp://css-tricks.com/vertically-center-multi-lined-text/

.container { 
 
    width: 160px; 
 
    margin: 80px auto; 
 
    padding: 5px; 
 
    height: 60px; 
 
    max-height: 60px; 
 
    border: 1px solid black; 
 
    display: table; 
 
} 
 

 
.container p { 
 
    height: 60px; 
 
    max-height: 60px; 
 
    display: table-cell; 
 
    vertical-align: middle; 
 
    text-align: center; 
 
}

<div class="container"> 
 
<p>This is a lot of text. A really large amount of text, even. So much text here. And it just keeps going, oh my. Wow - so much text.</p> 
 
</div> 
 

 
<div class="container"> 
 
<p>Here's one line.</p> 
 
</div>

JSFiddle：http://jsfiddle.net/Vc88w/2/

div要素がより大きくてはなりません60pxの指定された高さ、およびオーバーフローするテキストはすべて非表示にする必要があります。 divのオーバーフローを行うのに十分なテキストがない場合、CSSテーブルのトリックはうまく動作しますが、あまりにも大きすぎると、divが60px（最初の例）よりも大きくなるように強制します。

CSSテーブルの高さを上書きできる高さと最大高さ以外のCSSルールはありますか？別の方法として、コンテナdivに最大高さ60pxを適用しながら、垂直センタリングをどのように達成できますか？ ： 『テーブル表示』

Answer 1

はい、あなたは「.container」に変更する必要があります 『表示：ブロックを』

.container { 
width: 160px; 
margin: 80px auto; 
padding: 5px; 
height: 60px; 
max-height: 60px; 
border: 1px solid #000; 
overflow: hidden; 
display: block; 
}