私はログインの「ユーザー名」フィールドと「パスワード」フィールドを含むフィールドセットをページの中央に配置しようとしています。ここに私が持っているものは次のとおりです。CSSでフィールドセットを中心に設定
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
float: left;
}
ウィンドウサイズにかかわらず、フィールドセットをウィンドウの中央に配置します。グーグルでは、float: centerやalign: centerのような有用な情報は得られませんでした。
float: centerはありません。左右のみです。 Floatは、ブロックレベル要素をスタックフローから取り除くことによって水平方向に整列させることができます。 display:inline-blockと似ていますが、浮動小数点の方向にそろえています。
余白をautoに設定します。あなたは内部fieldsetノードを中央揃えにしたい場合は、これにtext-align:center;を追加することができます。
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
margin:auto;
}
ああ、私は狂っているはずです。 Downvoteは確かに値する。 – Chris
母は心配していません。下降は私からのものではありませんでした。 +1のためにそれをバランスさせる:) – AlienWebguy
それを包む要素がありそうなテキスト整列必要があります：センター;フィールドセットに余白を設定する必要があります。
fieldset{
//other stuff
margin: 0 auto;
text-align: left;
}
form
{
text-align: center;
}
ラップ要素のtext-alignを設定するのは、フィールドセットが自動左右のマージンを持つブロックレベルで表示されている場合は不要です。 – lsuarez
@lthibodeaux IEの古いバージョンの中には、それがなくても問題があるものがあるので、通常はそれを入れます。新しいブラウザであれば、無関係です。 –
これは問題を解決していません。折り返し親だけが中心に合わせられます。内容はコンポーネントの中央に配置されません –
誰かが実際に、ちょうどそれが動作します。このだって使う...これを試してみてください！
fieldset {
font-size:14px; padding:5px; width:500px; line-height:1.8; margin: 0 auto;
}
重要な行は、前の両方の答えで既に説明した 'margin：0 auto;'です。だから、この答えはどんな価値があるのですか？ – EWit
だけfloat:leftを削除し、float:leftは親要素の左に、あなたの要素を保持するためmargin: 0 auto;を追加します。 （親要素の幅が400pxより大きいと仮定すると）新しいCSSは次のようになります。
fieldset{
border: 1px solid rgb(255,232,57);
width: 400px;
margin: 0 auto;
}
はまた、そのようなfieldsetを置くことができます。
<div style="text-align:center">
.......fieldset here........
</div>
注：これはまた、fieldsetテキストの配置に影響を与えるので、あなたはfieldset内のテキストをしたい場合は、左または右に整列させます
<fieldset style="text-align:left">
floatの代わりに「margin：auto」を使用してください。 – hollandben