風格的搜索框和搜索按鈕使用CSS

Question

我有我的搜索框的問題，搜索框之間的搜索按鈕之間的差距只存在於IE7/8/9中。但它在Firefox中很好用。

編輯：在IE瀏覽器中，遊標也更高，但在Firefox中是完美的。

的jsfiddle：http://jsfiddle.net/bM7PQ/

HTML：

<form action="search.aspx" method="get" class="topsearchform" name="topsearchform"> 
    <fieldset> 

    <!--<label>Search:</label>--> 

    <input type="text" autocomplete="off" id="Text1" class="searchBox" name="SearchTerm" size="15"> 
    <input width="23" type="image" height="23" border="0" onclick="document.topsearchform.submit()" alt="Submit Form" src="http://i45.tinypic.com/ojkznb.png" class="searchButton"> 
    </fieldset> 
</form> 

CSS：在IE

form.topsearchform { 
    left: 70px; 
    padding-right: 20px; 
    position: absolute; 
    top: 87px; 
    width: 139px; 
} 

#topLinks form fieldset { 
    vertical-align: middle; 
} 


#Text1 { 
    background-color: transparent; 
    background-image: url("http://i46.tinypic.com/35c0n78.png"); 
    border: 0 none; 
    height: 23px; 
    padding-left: 3px; 
    padding-right: 3px; 
    width: 130px; 
} 


input.searchButton { 
    background-color: transparent; 
    background-image: url("http://i49.tinypic.com/r0rrtl.png"); 
    position: absolute; 
} 

問題：

Answer 1

添加此行input.searchButton

left:133px; 

Answer 2

你以前你自己的風格應用於任何類型的CSS重置？這有助於很多因爲它趨於規範HTML元素在不同瀏覽器上顯示的方式。

Answer 3

這樣做，你需要什麼，沒有位置是：絕對的，檢查小提琴：http://jsfiddle.net/LvP43/

form.topsearchform { 
    left: 70px; 
    padding-right: 20px; 
    position: absolute; 
    top: 87px; 
    width: 159px; 
} 

#topLinks form fieldset { 
    vertical-align: middle; 
} 


#Text1 { 
    background-color: transparent; 
    background-image: url("http://i46.tinypic.com/35c0n78.png"); 
    border: 0 none; 
    height: 23px; 
    padding-left: 3px; 
    padding-right: 3px; 
    width: 130px; 
    float: left; 
} 


input.searchButton { 
    background-color: transparent; 
    background-image: url("http://i49.tinypic.com/r0rrtl.png"); 
    float: left; 
}