我在一个div中有一个span，只需在容器div中设置margin:auto就可以了。

有两种更好的解决方案

显示：内联块；或显示：表格；

其中有两个显示：表；更好，因为显示：内联块；增加额外的边距。

用于显示：内联块；可以使用负边距方法来修复多余的空间

您可以使用内联块作为@user473598，但要注意较旧的浏览器。。

/* Your're working with */
display: inline-block;

/* For IE 7 */
zoom: 1;
*display: inline;

/* For Mozilla Firefox < 3.0 */
display:-moz-inline-stack;

Mozilla根本不支持内联块，但他们有-moz内联堆栈，这几乎是一样的

内联块显示属性周围的一些跨浏览器：https://css-tricks.com/snippets/css/cross-browser-inline-block/

您可以在以下位置看到一些具有此属性的测试：https://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/

只需设置宽度和高度以适合内容。这很简单。

div {

    width: fit-content;
    height: fit-content;
    padding: 10px;

}

我正在添加填充：10px；。如果省略了它，div元素将完全与表保持一致，看起来有点笨拙。填充将在元素的边界与其内容之间创建给定的空间。但这是你的愿望，不是强制性的。

display：inline块为元素添加额外的边距。

我建议这样做：

#element {
    display: table; /* IE8+ and all other modern browsers */
}

奖金：你现在只需添加margin:0auto，就可以轻松地将这个新奇的#元素居中。

display: -moz-inline-stack;
display: inline-block;
zoom: 1;
*display: inline;

Foo Hack–对内联块样式的跨浏览器支持（2007-11-19）。