1

これは些細なことですが、マークアップをスタイリングする粒度を考えると、コンテンツを中央に配置することができません

マークアップは基本的に次のとおりです。

<div class = "rectangle" id = "login">
    <form>
     <!-- bunch of labels and corresponding input fields -->
    </form>
</div>

スタイルシートは基本的に次のとおりです。

.rectangle{ border:1px solid #ccc; width:500px; padding: 10px;}
#login{margin:auto;}
#login form {margin:auto;}

残念ながら、これは私のフォームの内容を中央揃えにしません。それらは、含まれている親要素 (div クラスの四角形) の左側に近くなっています。ここで何が間違っていますか?

4

1 に答える 1

5

これを試して

CSS

.rectangle{ 
    border:1px solid #ccc; 
    width:500px; 
    padding: 10px;
    text-align:center;
}

HTML

<div class = "rectangle" id = "login">
    <form>
        <input type="text" name="txt1" />
        <input type="text" name="txt2" />        
    </form>
</div>​

デモ

于 2012-08-05T20:51:12.520 に答える