对齐标记

<div style="width: 100%;">
    <input type="text" style="float: left; width: 200px;" id="url" value="Paste URL here">
    <button style="font-size: 10px; margin: 2px; float: left;" id="i">Go</button>
</div>

提交按钮在不同的浏览器中似乎有不同的默认边距和填充值。

我想这一定在 some reset Stylesheet 因为这并不是唯一恼人的跨浏览器“默认”值差异。网络何时会标准化这是另一个主题。

我们就是这样做的:

#searchForm {
    position: relative;   // you must keep this
    font-weight: normal;
    font-family: Arial, Helvetica, sans-serif;
    margin-bottom: 30px;
}
input#searchEntry {
    padding: 0;    // you must keep this
    margin: 0;     // you must keep this
    margin-top: 3px;
    width: 198px;
    font: 17px Arial,Helvetica,sans-serif;
}
input#searchBtn{
    padding: 0;   // you must keep this
    margin: 0;    // you must keep this
    position: absolute;   // you must keep this
    left: 203px;
    top: 2px;
    height: 24px;
    width: 42px;
    font-size: 14px;
    background: url(http://yourDomain/img/yourPrettySearchIcon.png) buttonface no-repeat 9px 1px;
    cursor:pointer;
    cursor:hand;
}


<form id="searchForm" name="mySearchForm" action="myPage.html" method="post">
    <input name="searchEntry" value="" id="searchEntry" type="text"/>
    <input name="searchBtn" value="" id="searchBtn" type="submit"/>
</form>

我注意到IE8、Firefox和GChrome之间的差异很小,但在其他浏览器中可能存在差异。

这里的表单将其位置设置为“相对”,这样当我将按钮的位置设置为绝对时,按钮位置本身就相对于searchForm。

应该在同一条线上。

请检查一下 <li> and <li> 的父标记( <ul> 或者别的什么)。 我想这可能是原因。