css - 使 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