使父容器适合内容

Question

我有这个布局jsfiddle。

<a>
<span class="blue">111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111</span>
<span class="red">111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111 111</span>
</a>

span {
    display: inline-block;
}
.red{
    background-color:red;
}
.blue{
    background-color:blue;
}
a {
    display: inline-block;
    background-color:green;
}

我希望在调整大小期间使父锚适应内跨的宽度以响应响应行为。怎么样？

Answer 1

在display: block

上使用span

Fiddle

span {
    display: block;
}