小编JoJ*_*oJo的帖子

阻止文本扩展收缩包装div

我有一个收缩器div,它收缩缠绕在其他几个div上,因此固定器没有固定宽度.持有者内部还有另一个包含文本的div.当文本太多时,它会扩展持有者,因此它不会再收缩.这是我的问题的演示,http://jsfiddle.net/WSbAt/.这是一个照片库页面.

我想可能没有设置支架宽度的方法,因为每行的图像数量是动态的,所以我不能这样做.我可以用jQuery来解决它,但希望有一个css解决方案.

编辑:我试图不指定任何宽度,因为每行的缩略图数量取决于您的窗口大小.

演示:http://jsfiddle.net/WSbAt/

CSS:

#container
{
    width:600px; /*only set for demo. will be random on live page*/
    border:1px solid black;
    text-align:center;
}
#holder
{
    display: inline-block;
    border:2px solid blue;
}
.thumbnail
{
    float:left;
    width:100px;
    height:100px;
    background-color:red;
    margin-right:10px;
    margin-bottom:10px;
}
.expandedHolder
{
    padding:10px;
    border:2px solid yellow;
    margin-bottom:10px;
    margin-right:10px;
}
.fullImage
{
    float:left;
    width:250px;/*only set for demo. will be random on live page*/
    height:200px;
    background-color:green;
}
.text
{
    float:left;
    margin-left:10px;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

<div id="container">
    <div id="holder"> …
Run Code Online (Sandbox Code Playgroud)

html css width

6
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

html ×1

width ×1