0

我找不到我的问题的解决方案,所以我向你寻求帮助......我有 1 个 div,它根据浏览器窗口的高度改变它的高度。在这个 div 里面是 5 个另外的 div,每行 4 个,当我将窗口大小调整为更小的尺寸时,div 落在第 2、3 行等上。这很好,但是这些 div 不在调整大小的主 div 的中间这就是我要找的...谢谢

HTML:

<div id="main">

<!--Div1-->
<div class="mosaic-block fade">
</div>

<!--Div2-->
<div class="mosaic-block fade">
</div>

<!--Div3-->
<div class="mosaic-block fade">
</div>

<!--Div4-->
<div class="mosaic-block fade">
</div>

<!--Div5-->
<div class="mosaic-block fade">
</div>

</div> <!--main-->

CSS:

div#main {
border: #CCCCCC thin solid;
max width: 840px;
height:600px;
min-width: 210px;
border: #CCCCCC thin solid;
margin:0 auto;
max-width: 840px;
}

.mosaic-block {
margin-bottom:50px;
position: relative;
float:left;
margin:4px;
top:50px;

overflow:hidden;
width:200px;
height:200px;
background:#111 url(../img/progress.gif) no-repeat center center;
border:1px solid #fff;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);
}
4

2 回答 2

1

而不是float:left;.mosaic-block,您可能想尝试display:inline-block;添加text-align:center;到您的主文件中。它有点脏,但它有效!

PS。你可能想删除它max width: 840px;,我怀疑它是一个有效的声明!

于 2013-05-18T16:43:55.353 回答
0

添加你的 CSS #Main

overflow:auto;
于 2013-05-18T16:34:08.820 回答