如何使外部元素的宽度与其内容的宽度相匹配？

Question

<div> 
    <ul> 
     <li>Caption1</li> 
     <li>Caption2</li> 
     <li>Caption3</li> 
     <li>Caption4</li> 
    </ul> 
</div> 

基本上，列表中的项目定位在与浮在同一行：左在他们的风格和DIV有环绕UL元素1px的边框：

唯一的问题，我必须手动设置外层div的宽度。如果我将宽度设置为较低的值，内容将缩小，而不是推开容器div的边框：

任何建议如何解决这一问题？

Answer 1

设置div有display: inline-block（并把它里面的另一个div保持原有div的块状属性）