div覆蓋在文本p標籤

Question

我創建了這個jsFiddle，我想知道如何調整div內的<p>標籤，以便根據文本中的文本調整高度，而不是將其隱藏在另一個div的後面。

http://jsfiddle.net/qGzer/

<div class="nameImage"> 
    <div class="gridLetter"> 
      <div>A</div> 
     </div> 
     <figure class="thumbnail avatar circularGridVw"> 
      <img alt="Gravatar" src="http://www.gravatar.com/avatar/4425027572854858d9ebc2fe1c2fd847?s=150&amp;d=identicon&amp;r=G"> 

     </figure> 
     <p>Jackie ThunderBirdies James</p> 
    </div> 

Answer 1

它添加到CSS的div

的

position: absolute; 



.gridLetter { 
font-size: 20px; 
font-weight: bold; 
margin-top: 4px; 
display: block; 
height: 17.7px; 
    position: absolute; 

} 

http://jsfiddle.net/qGzer/1/

Answer 2

在你的div就會限制高度

Answer 3

嗨剛剛成立的height:auto。看到這裏你的代碼http://jsfiddle.net/qGzer/23/

.nameImage { 
    width:158px; 
    height:auto; 
} 

我設立了float:left到display:inline-block預留空間中的div的不同高度的情況下。