使 div 宽度适合内容而不是父级

Question

我想为我拥有的按钮制作标签。我的问题是标签比按钮宽。我目前已经这样做了（简单的例子）：

<div class="parent_container_the_icon">
    <div class="label">
        This is the label text
    </div>
<div>

CSS：

.parent_container_the_icon {
    height: 50px;
    width: 50px;
    float: left;
}

.label {
    display: block;
    position: absolute;
    white-space: nowrap;
}

我想要的是标签在不包装文本的情况下采用标签文本本身的宽度。目前它没有包装文本，但我在标签框中看到文本溢出，因为该框仅占用容器的最大宽度。

如何强制标签div适合文本的大小而不继承父级的宽度？

Answer 1

我想你已经得到了你想要的。也许检查另一个浏览器？
这是你的代码：jsfiddle