使父DIV的子女的寬度

我試圖讓一個父div的子元素的寬度在其中沒有設置固定的寬度。但是，我沒有運氣。使父DIV的子女的寬度

我需要大小的元素位於「內容容器」內，該容器沒有定義寬度，因此是頁面的寬度。

我已將它放到小提琴（http://jsfiddle.net/8LfsW/）中，並且'content-container'的寬度設置爲模擬它在更大的屏幕上查看。您會看到'mag-details'容器比它內容大。

現場使用的。內容，主要風格是：

.content-container{ 
    font-family:"helvetica neue",helvetica,arial; 
    margin:auto; 
    margin-top:20px; 
}

和MAG細節風格

#mag-details{ 
    margin:auto; 
    background:#FCFCFC; 
    border:1px solid #CCCCCC; 
    border-radius:8px; 
    max-width:1200px; 
    box-shadow:1px 1px 2px #CCCCCC; 
}

如果有人能告訴我如何，如果可能的大小MAG-細節容器其內容的大小，將不勝感激。非常感謝提前！

來源

2014-01-14 J Spring

嘗試使''mag-details'使用'display：inline-blo ck' –

可能的重複[here]（https://stackoverflow.com/questions/450903/make-div-width-equal-to-child-contents）和[here]（https://stackoverflow.com/questions/ 10406268 /製作子女，決定最尺寸的父-DIV）。 – ajp15243

父更改爲

display: inline-block;

http://jsfiddle.net/HT46H/

來源

2014-01-14 16:52:26

兩個選項：

float:left。 jsFiddle example
display: inline-block。 jsfiddle example

來源

2014-01-14 16:54:29 j08691

我會刪除花車和這些元素使用inline-block。

然後纏繞元件上使用white-spane:nowrap所以當屏幕太小，只要不破..

所以加

min-width:100%; 
display:inline-block; 
white-space:nowrap;

到#mag-details，改變li元素display:inline-block

結果在http://jsfiddle.net/gaby/54kjf/

來源

2014-01-14 17:03:07

使父DIV的子女的寬度

回答

相關問題