[英]input height different in ios
我在一個名為homesearchcontent的div內的右側,有一個搜索欄和一個按鈕。 問題在於,在IOS觸摸設備上,搜索欄比按鈕高。
這是代碼:
HTML:
<form action='./results.php' method='post' class="homesearchcontent">
<input type='text' name='input' id="searchdevice" class="search-field" placeholder="" />
<input type='image' src='img/search6.png' class="search-button">
</form>
CSS:
.homesearchcontent {
position: relative;
padding-left: 2px;
width: 100%;
text-align: center;
margin-left: auto;
margin-right: auto;
padding-bottom: 50px;
}
.search-field {
-webkit-border-radius: 3;
-moz-border-radius: 3;
border-radius: 3px;
border: solid #191919 1px;
padding-right: 1%;
padding-left: 1%;
width: 70%;
height: 40px;
vertical-align: top;
font-size: 1.8em;
font-family: Arial, sans-serif;
text-decoration: none;
}
.search-button {
outline: none;
vertical-align: top;
width: 36px;
height: 36px;
clear: both;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: #ffffff;
padding: 2px 7px 2px 7px;
border: solid #191919 1px;
text-decoration: none;
}
有人可以幫我嗎?
嘗試使用box-sizing: border-box;
兩個輸入的高度相同。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.