如何在div元素中水平居中按钮元素？
如何在div元素中水平居中按钮元素？
提问于 2013-03-09 01:52:47
我不想将CSS添加到我的div元素中(例如<div style="text-align: center;">)。
我只想将CSS代码添加到按钮元素中。
<div>
<button>Button</button>
</div>
在这种情况下，如何使按钮水平居中？
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-03-09 01:54:59
button {
margin:0 auto;
display:block;
}
button {
margin: 0 auto;
display: block;
}<div>
<button>Button</button>
</div>
Stack Overflow用户
发布于 2013-03-09 01:55:31
您需要在<button>上使用display: block; margin: auto;。jsFiddle
Stack Overflow用户
发布于 2013-03-09 02:03:43
其他人已经提到了margin: 0 auto;方法，但是如果您需要解释，浏览器会在您的元素所在的任何容器中拆分可用的空间。
同样重要的是要指出的是，你可能需要给你的元素一个宽度，这是正确的工作。
所以，总而言之：
button {
display:inline-block; //Typically a button wouldn't need its own line
margin:0 auto;
width: 200px; //or whatever
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15300234
复制相关文章
相似问题
腾讯云开发者
