-1

検索ボックスに問題があります。検索ボックスの間に検索ボタンの間にギャップがあり、この問題は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：

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;
}

IEの問題：

ここに画像の説明を入力してください

4

3 に答える 3

1

この行をに追加しますinput.searchButton 

left:133px;
于 2012-06-13T10:42:56.017 に答える
1

独自のスタイルの前に、任意のタイプのcssリセットを適用しましたか？これは、さまざまなブラウザでのhtml要素の表示方法を正規化する傾向があるため非常に役立ちます。

于 2012-06-13T10:43:14.057 に答える
1

これはあなたが必要としていることを行い、位置はありません：絶対、フィドルをチェックしてください：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;
}
于 2012-06-13T11:26:57.883 に答える