如何調整輸入組件的大小？

Question

這裏是我想實現

這裏的UI原型就是我目前有：JSFiddle，什麼我的佈局看起來像目前

我試圖調整輸入組件的大小以便它與UI /搜索圖標中的高度相匹配。

下面是輸入組件
的HTML代碼（我設置colspan 3，使輸入將跨越從「聯繫我們」的美國國旗。）

<td colspan="3"><input class="help_header" type="text" /></td> 

而且CSS代碼風格是

input { 
    background-color:white; 
    padding: 0px; 
    height: 1px; 
    vertical-align:bottom; 
} 

有誰知道如何調整輸入組件的高度在這種情況下？我試着將高度屬性設置爲1px，但沒有做任何事情。我也試着將它與搜索圖標的底部垂直對齊，但那也沒有做任何事。

Answer 1

從.help-header的填充是給012bd高度有些麻煩。

卸下從input填充沒有特技，通過修改選擇器.help_header:not(input)

Fiddle

Answer 2

您可以使用font-size和line-height attrs。或設置溢出：隱藏，所以你可以使用高度屬性。有關於這個問題的好文章http://www.sitepoint.com/style-web-forms-css/