CSS顯示格爲表

Question

我有一個內部的3個div的一個DIV的顯示錶是這樣的：

.WKDivTable img { 
 
    width: 80px; 
 
    height: auto; 
 
    padding: 5%; 
 
    padding-bottom: 0px; 
 
} 
 
.WKDivTable span { 
 
    padding-right: 0px; 
 
    font-size: 0.7em; 
 
} 
 
.WKDivTable input[type=number] { 
 
    width: 50%; 
 
    margin-top: 0px; 
 
    height: 30px; 
 
} 
 
.WKDivTable > div { 
 
    display: table-cell; 
 
    padding: 0%; 
 
} 
 
.WKDivTable { 
 
    display: table; 
 
    table-layout: fixed; 
 
}

<div class="WKProdukt"> 
 
    <h3>Quest America</h3> 
 
    <div class="WKDivTable"> 
 
    <div> 
 
     <img src="<?php echo $ROOT.'product/img/1020-quest-america.jpg'?>" title="Quest America"> 
 
    </div> 
 
    <div> 
 
     <span>Perfektes Modell für Amerikanische Patrioten. Balsaholz Flügel, abgerundete Plastikspitze machen diese Rakete zu einer guten Skill Level 1 Rakete. Landefallschirm ist dabei. Motoren A6-3 rocket B6-4, C6-5 Rocket Engine.</span> \t 
 
    </div> 
 
    <div> 
 
     <span>Anzahl</span> 
 
     <input type="number" title="Anzahl Artikel die sie bestellen" value="1" /> 
 
     <span class="bold">Preis: 50.-</span> 
 
     <span class="bold">Produkt-ID: 1020</span> 
 
     <span class="bold">Status: Sofort Lieferbar</span> 
 
    </div> 
 
    </div> 
 
</div>

的3格設置突然有填充頂： 能」噸顯示圖片，因爲我需要聲譽大聲笑...

正如你可以看到3. div的內容不像其他2 div的頂部。

有人知道這可能是什麼嗎？

Answer 1

您可能需要調整內部div的vertical-align，例如，

.WKDivTable > div { 
    display : table-cell; 
    padding : 0; 
    vertical-align : top; 
}