是否有可能與純CSS使父div調整大小，以適應內聯塊白色空間nowrap內容

Question

我想解決，如果有反正，使父母的div調整大小，以適應內容時，故意防止內容從包裝。作爲一個例子，這裏是一個jsfiddle jsfiddle.net/wtQfV來說明我的問題。

的示例代碼：

HTML

<div class="box_holder"> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
<div class="box"></div> 
</div> 

CSS

.box_holder{ 
    border:1px solid red; 
    white-space:nowrap; 
} 

.clearfix{ 
    clear:both; 
} 

.box{ 
    width:30px; 
    height:20px; 
    margin:10px; 
    background-color:red; 
    display:inline-block; 
} 

是否有任何變通這個或我應該接受我追逐彩虹和我需要一個JavaScript解決方案。

Answer 1

可以使.box_holder元是inline-block以及..

.box_holder{ 
    border:1px solid red; 
    display:inline-block; 
    white-space:nowrap; 
} 

演示在http://jsfiddle.net/gaby/wtQfV/5/

---

如果你希望它仍然可以保持100％的寬度時，有房，你可以添加min-width:100%它

.box_holder{ 
    border:1px solid red; 
    display:inline-block; 
    min-width:100%; 
    white-space:nowrap; 
} 

Demo at http://jsfiddle.net/gaby/wtQfV/7/

Answer 2

試試這個：

在CSS .box_holder

http://jsfiddle.net/wtQfV/4/

取出white-space:nowrap;或添加display:inline-block;上.box_holder

http://jsfiddle.net/wtQfV/6/