我有一个 div,它可以根据不同的场景有 2 个或 4 个按钮。我希望 div 内的按钮居中对齐。怎么做到的。我已经在下面提交了我的代码。
<div style="margin: 0 auto; width: 656px;">
<input type="submit" style="float:left;" value="Prev"/><input type="reset" value="Reset" style="float:left;"/>
<input type="submit" value="Submit" style="float:left;"/><input style="float:left;" type="submit" value="Close"/></div>
问题是它在显示四个按钮时有效,但不适用于 3,2 和 1 个按钮的情况。如何在不指定宽度的情况下居中对齐?请帮忙。
最佳答案
您需要在容器元素上使用 text-align: center
。此外,避免使用内联 样式...
<div style="margin: 0 auto; width: 656px; text-align: center;">
Note: Make sure that you use
text-align: left;
if you have any text inside thatdiv
else they will be centered as well.
正如你评论的那样,它看起来像是我的中心
您仍然不相信它们是完美居中的,我会调整容器 width
并向您展示它们是居中的....
有 2 个按钮
Note: Make sure you use CSS Reset as well... So that you get consistent styles in all browsers though this should be centered regardless of resetting the styles.
关于html - div 中动态居中对齐按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21722432/