我有一个使用div显示的网站,如果在正常情况下,这个显示将保持整洁。但如果它缩小了,这将会搞砸。
我找到了一种方法来解决这个问题,将这些元素限制在一个表中。所以即使它被缩小,元素仍保留在表格中。
还有其他方法可以解决这个问题吗?
以下是代码:
<div id="tGallery">
<div class="content">
<div class="title">
Gallery
</div>
<div class="images">
<img src="<?php echo base_url(); ?>/img/gallery_img_1.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_2.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_3.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_2.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_1.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_3.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_3.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_2.jpg"/>
<img src="<?php echo base_url(); ?>/img/gallery_img_1.jpg"/>
</div>
<div class="btnContainer">
<div class="btn">See More</div>
</div>
</div>
</div>
这是css代码:
#tGallery{
width:340px;
float:left;
}
#tGallery .content{
padding-top:9px;
}
#tGallery .images{
text-align:center;
}
#tGallery img{
border:1px solid #770808;
margin:0px 0px 4px 0px;
}
#tGallery .btn{
width:75px;
float:right;
margin:0px 8px 15px;
padding:3px 4px;
}