保持最长孩子的容器宽度

Question

简而言之：当我有一个容器和一些内联块div时，容器的宽度会在div周围缩小。但是当div太长并且因此其中一个转到另一行时，容器宽度呈现为100％。

在图片中，默认行为是第一个，而所需行为是第二​​个。

这是一个小例子： http://jsfiddle.net/gzbx4upq/

See fiddle for desired results

Answer 1

使用

display:block;

或

display:inline;

或

max-width:250px ;

Answer 2

使用伪类似乎是可能的。

<强> CSS

div {
    display: inline;
    position: relative;
}
div:before {
    content:"";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -5px;
    top: -5px;
    background-color: blue;
    z-index:-1;
}
div:after {
    content:"";
    display: block;
}
p {
    display: inline-block;
    background-color: red;
}

<强> Working Fiddle