1

私が知っている CSS の要素を中央に配置するあらゆる方法を試しましたが、これらのフォーム要素をページの中央に配置することはできません。

私のコード: http://jsfiddle.net/VJLst/1/

<style>
#divQuizFillBlank {
    margin-left: auto;
    margin-right: auto;
}
#textQuizFillBlankUserAnswer {
    border: 2px solid #000;
    font-size: 16px;
    font-weight: bold;
    width: 80%;
    height: 40px;
    float: left;
    box-sizing: border-box;
    vertical-align: middle;
}
#buttonQuizFillBlankSubmit {
    border: 2px solid #000;
    font-size: 20px;
    font-weight: bold;
    width: 10%;
    height: 40px;
    float: left;
    margin-left: 5px;
}
</style>

<div id="divQuizFillBlank">
<input type="text" id="textQuizFillBlankUserAnswer">
<input type="button" id="buttonQuizFillBlankSubmit" value="&gt;">
</div>
4

1 に答える 1

3

widthforを設定する必要があります#divQuizFillBlank。

ルールは、 のmargin: auto;ない要素では機能しませんwidth。さらに、要素に対してのみ機能しblock、それらの要素は利用可能な幅全体を占有します。

#divQuizFillBlank {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
}

フィドルの更新: http://jsfiddle.net/praveenscience/VJLst/2/

于 2013-02-20T02:32:31.427 に答える