0

Facebookにあるものと同様の検索フィールド、テキストフィールド、および検索用の検索画像付きのボタンを作成しようとしています。

マークアップ

    <div>
        <div style="width: 250px;">
            <input id="txtSearchPerson" type="text" style="width:150px;float:left;" />
            <img id="btnSearch" src="search.png" style="float:left;" />
        </div>
    </div>

2 つのコントロールは、希望どおりに水平方向に配置されています。

問題は、入力 (テキスト フィールド) の右上が画像の左上に揃えられていないことです。

これはjqで修正できますが、CSSで処理する必要があります。

「vertical-align」やその他の既知のプロパティを試してみましたが、成功しませんでした。私は親コンテナを疑っていますが、それでも長時間動作させることはできません...

手伝ってください。

前もって感謝します！

4

1 に答える 1

0

画像の上部と画像の左側にパディングを追加して、フォーマットを期待どおりに整列させることができます。

<div>
        <div style="width: 250px;">
            <input id="txtSearchPerson" type="text" style="width:150px;float:left;" />
            <img id="btnSearch" src="search.png" style="float:left;padding-top:.2em;padding-left: .1em;" />
        </div>
</div>

http://jsbin.com/umituz/2/edit

于 2013-01-17T14:06:53.660 に答える