css - 使用 css 减少 block 的宽度

Question

这是我创建的页面:

我想减少以橙色作为背景色的 block 的宽度，而不在属性宽度中使用数字，是否有其他方法可以做到这一点？

我试过 float:left;它有效，但它向左移动我希望根据文本长度和 html 页面的中心自动检测宽度。

Answer 1

一种解决方案是在 div 周围添加一个包装器元素:

<div id="outer">
    <div id="inner">Vous avez acheté 6 pieces, le total à payer est : 200DH</div>
</div>

然后:

#inner {
    display: inline-block; /* for the background */
}

#outer {
    text-align: center; /* for centering */
}

http://cssdesk.com/Y8SB8

当然，如果 div 的父级已经具有 text-align: center，则包装器是不必要的。