使父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的子女的宽度

回答

相关问题