div带显示:inline-block margin 0自动不居中 [英] div with display:inline-block margin 0 auto not center

查看:248
本文介绍了div带显示:inline-block margin 0自动不居中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<div style="display: inline-block; margin: 0 auto;">
    <input id="abc" type="button" value="button" />
</div>

我尝试使用上面的代码设置它的内容的宽度, margin:0 auto;

I try to use the code above to set the width of equal it's content, and then center it with margin: 0 auto;

但它没有在任何浏览器上为我工作。任何建议?

But it did not work for me on any browser. Any suggestion?

BTW,当我设置width属性,它工作正常。

BTW, when I set the width property, it works fine.

<div style="width: 10em; margin: 0 auto;">
    <input id="abc" type="button" value="button" />
</div>


推荐答案

display:table;也会将它放在中心:

display:table; would position it in center too:

CSS:

  .button{
    display: table;
    margin: 0 auto;
    }

HTML:

<div class="button">
<input id="abc" type="button" value="button" />
< /div>

注意:使用内联样式是一种不好的做法。

Note: Using inline styles is a bad practice.

这篇关于div带显示:inline-block margin 0自动不居中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆