居中设置了CSS的字段

我试图将包含登录“用户名”和“密码”字段的字段集居中放置在页面的中心。这是我有：居中设置了CSS的字段

fieldset{ 
    border: 1px solid rgb(255,232,57); 
    width: 400px; 
    float: left; 
}

我希望字段集在窗口居中，无论窗口大小。谷歌搜索没有产生任何帮助，如float: center或align: center属性。

2011-10-26 Chris

使用“保证金：汽车”，而不是浮 – hollandben

没有float: center，只有左，右。浮点只允许块级元素通过将它们从堆栈流中取出来进行水平排列。它与display:inline-block类似，不同之处在于它们与浮动方向对齐。

你想要的是将边距设置为自动。如果要居中对齐节点内的fieldset，您可以添加text-align:center;这样：

fieldset{ 
    border: 1px solid rgb(255,232,57); 
    width: 400px; 
    margin:auto; 
}

2011-10-26 02:20:19 AlienWebguy

天啊我必须要疯了。 Downvote当然是值得的。 – Chris

哈哈不用担心男人。 downvote不是从我。 +1来平衡这一点:) – AlienWebguy

元素包裹它可能需要文本对齐：中心;在它上面，然后你需要设置fieldset的边距;

fieldset{ 
    //other stuff 
    margin: 0 auto; 
    text-align: left; 
} 

form 
{ 
    text-align: center; 
}

2011-10-26 02:22:46

如果字段集显示的块级别具有自动的左右页边距，那么设置包装元素上的文本对齐将是无关紧要的。 – lsuarez

@lthibodeaux IE的一些老版本没有它可能会有麻烦，所以我通常会把它放进去。对于任何新的浏览器来说，这是无关紧要的。 –

这不是解决问题。只有包装父母被调整到中心。内容不会集中到组件的中心 –

-1

有人尝试这个......其实，只要使用该怎么把它的作品！

fieldset { 
    font-size:14px; padding:5px; width:500px; line-height:1.8; margin: 0 auto;  
}

2014-10-15 12:42:16 Ukheby

重要的一行是'margin：0 auto;'这是前两个答案已经提到的。那么这个答案增加了什么价值？ – EWit

只是删除float:left，并添加margin: 0 auto;因为float:left让您的元素留下的父元素。（假设父元素宽度大于400px;）您的新CSS将如下所示。

fieldset{ 
    border: 1px solid rgb(255,232,57); 
    width: 400px; 
    margin: 0 auto; 
}

2017-03-16 05:44:18

你也可以把fieldset这样的：

<div style="text-align:center"> 
    .......fieldset here........ 
</div>

注意：这也影响fieldset文本的对齐方式，所以如果你想在fieldset内的文本左对齐或右，你可以使用：

<fieldset style="text-align:left">

2018-02-12 11:18:21 Ahmed

回答