我有一个收缩器div,它收缩缠绕在其他几个div上,因此固定器没有固定宽度.持有者内部还有另一个包含文本的div.当文本太多时,它会扩展持有者,因此它不会再收缩.这是我的问题的演示,http://jsfiddle.net/WSbAt/.这是一个照片库页面.
我想可能没有设置支架宽度的方法,因为每行的图像数量是动态的,所以我不能这样做.我可以用jQuery来解决它,但希望有一个css解决方案.
编辑:我试图不指定任何宽度,因为每行的缩略图数量取决于您的窗口大小.
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)