2

我一直在做一个网站，我遇到了一个问题。

我的 div 无法正确对齐事件、新闻和三个中间描述......这是代码。（对不起，如果它很混乱......我现在也在努力。）它不会让我发布事件和新闻的代码，所以请耐心等待。

三个描述 div。

<div class="mainall">

 <div class="descc1">
 <div class="deschead1"></div>
 <div class="thumb1"></div>
 <div class="head1"></div>
 <div class="headbg1"></div>
 <div class="descsep1"></div>
 <div class="desc1">
     <p></p>
 </div>
 </div>

 <div class="descc2">
 <div class="deschead2"></div>
 <div class="thumb2"></div>
 <div class="head2"></div>
 <div class="headbg2"></div>
 <div class="descsep2"></div>
 <div class="desc2">
     <p></p>
 </div>
 </div>

 <div class="descc3">
 <div class="deschead3"></div>
 <div class="thumb3"></div>
 <div class="head3"></div>
 <div class="headbg3"></div>
 <div class="descsep3"></div>
 <div class="desc3">
     <p></p>
 </div>
 </div>
</div>

CSS - http://pastebin.com/HPSikFjM

主要 =

.mainall {
 display: block;
 margin-top: 25px;
 overflow: hidden; }
4

2 回答 2

0

好的，我想我明白你在做什么。您需要将每个列向左浮动，然后为最后一个元素添加明确的修复。

<div id="outside-div-that-expands-to-full-avaliable-size">
   <div class="third">First</div>
   <div class="third">Second</div>
   <div class="third">Third</div>
   <div class="clear"></div>
</div>

与CSS

.clear { clear:both; }

这是你想要的效果吗？http://jsfiddle.net/HPY2X/1/

于 2013-03-31T05:49:12.923 回答
-1

这非常有效 - 我在您的实时网站上对其进行了测试：

CSS：

.descc1{
margin-right: 2.1275%;
float: left;
margin-top: 10px;
width: 31.914893617021%;
}

.descc2 {
float: left;
margin-top: 10px;
width: 31.914893617021%;
margin-right: 2.127659574468%;
}

.descc3 {
float: left;
margin-top: 10px;
width: 31.914893617021%;
}

.mainbox {
margin-left: auto;
margin-right: auto;
overflow: hidden;
display: block;
float: left;
width: 100%;
}
于 2013-03-31T07:48:38.873 回答