2015-05-02 51 views
0

您好,我在定位提交按鈕時遇到了一些問題。我已經發布了下面的代碼。在div中放置一個提交按鈕

HTML

<div class="search"> 
    <form action="post"> 
    <input type="text" name="fname" placeholder="First name"> 
    <input type="text" name="lname" placeholder="Last name"> 
    <input type="submit" name="submit" value="Search"> 
    </form> 
</div> 

CSS

.search { 
    position: absolute; 
    background-color: red; 
    width: 100%; 
    height: 30px; 
} 
input[type="text"] { 
    background-color: #f7f7f7; 
    height: 30px; 
    width: 280px; 
    color: #4D4C4C; 
    font-family: 'Open Sans', sans-serif; 
    font-size: 16px; 
    padding: 0px 5px 0px 5px; 
    -webkit-box-sizing: border-box; 
    moz-box-sizing: border-box; 
    box-sizing: border-box; 
    border: 1px solid rgba(147, 184, 189,0.8); 
} 
input[type="submit"] { 
    font-family: 'Open Sans', sans-serif; 
    font-size: 13px; 
    height: 30px; 
    width: 100px; 
} 

這裏是示出輸出圖像。我的問題是,提交按鈕上方有一個小空間,我無法找到原因,因爲它們的高度都設置爲30px。我希望按鈕與.search div具有相同的高度。身高:100%似乎不起作用。

http://i57.tinypic.com/atswm0.png

回答

0

嘗試增加:

input[type="submit"] { 
    position: absolute; 
} 
+0

非常感謝,我很新的HTML和CSS所以這是非常有幫助! – user3545315