1

この入力フィールドをコンテナー (緑色のボックス) 内で水平方向および垂直方向の中央に配置しようとしています。

CSS3 flexbox テクニックなしでそれを行う方法はありますか?

通常のセンタリング手法、マージンと自動、ポジショニングなど、私が試したすべてが機能しません。

まあ、ポジショニングの問題はそれが機能することですが、それを下に移動するより良い方法が必要です.

何か案は？

ここにページがあります: https://dl.dropboxusercontent.com/u/270523/help/new.html

ID #searchInput で入力を中央に配置しようとしています

4

3 に答える 3

2

セクション コンテナーに追加position: relativeし、絶対配置を使用して、入力高さの半分の負のマージンを使用して、入力フィールドを垂直方向に中央揃えにします。

#input {
    position: relative;
}

#searchInput {
    position: absolute;
    top: 50%;
    margin-top: -0.809rem;
}
于 2013-04-19T21:48:08.123 に答える
0

次のようなことができます。

<div style="display:table;">
    <div style="display:table-cell;vertical-align:middle;text-align:center;">centered box</div>
</div>

JSFiddle: http://jsfiddle.net/V8GUn/

于 2013-04-19T21:50:17.103 に答える
-1

これをコードに追加してみてください

#searchInput { margin-top: 5px; }
于 2013-04-19T22:01:09.707 に答える