0

我有这个输入文本和输入按钮，我试图让它们具有相同的高度......你可以在右上角的http://www.taranmarlowjewelry.com/上看到这个......它们看起来一样高吗? 如果不是，我如何让它们保持相同的高度？

<form class="product_search" style="font-size:0px !important;" method="GET" action="<?php echo $pp_url?>/" >
<input name="product_search" id="wpsc_search_autocomplete" class="wpsc_product_search wpsc_live_search_embed .wpsc_live_search" autocomplete="off" style="padding:0px !important; height:23px !important;" />
<input type="submit" id="button" name="button" class="searchBtn" value="GO"/>
</form>

和CSS：

.searchBtn {
    background-color: #FFA18A;
    border: 0 none;
    color: #FFFFFF;
    cursor: pointer;
    height: 25.5px;
    width: 32px;
}
4

3 回答 3

1

文本输入的有效高度为 27px，而按钮的有效高度为 25px。

尝试添加这些样式：

.searchBtn{
  padding: 0;
  height: 27px;
}
于 2012-07-04T18:00:45.387 回答
0

让它们背靠背浮动，并确保通过在按钮上添加额外的高度来补偿输入的边框。请参阅此处的示例：http: //jsfiddle.net/wAgfe/

于 2012-07-04T18:02:15.297 回答
0

您已定义：

input name="product_search" : height:23px !important
input name="button" : height: 25.5px;

统一两个高度有什么问题吗？

于 2012-07-04T18:06:09.720 回答