Question

我在一个接一个地（水平地）显示grid_8块时遇到问题。

前两个grid_8 div并排，但最后一个div在下面...任何人都可以看到我在这段代码中做错了什么？如果您需要更多信息，请随便询问，我会发布更多代码。

谢谢！

<div class="wrapper">
   <div class="grid_24">
      <div class="wrapper indent-bottom8">
         <h3 class="title1 p4">Our Services</h3>
         <div class="grid_8">
            <div class="banner maxheight">
               <figure class="img-indent">
                  <img src="images/page1-img1.jpg" alt="">
               </figure>
               <h5><a href="services.html">RESIDENTIAL <br class="hide-tp">CLEANING</a></h5>
               Monoblock, concrete, driveways, slabbing, walls, garden furniture, forecourts and more...
            </div>
         </div>
         <div class="grid_8">
            <div class="banner maxheight">
               <figure class="img-indent">
                  <img src="images/page1-img2.jpg" alt="">
               </figure>
               <h5><a href="services.html">COMMERCIAL <br class="hide-tp">CLEANING</a></h5>
               Shopping centres, loading bays, car parks, pathways, beer gardens and more...
            </div>
         </div>
         <div class="grid_8 last-item">
            <div class="banner maxheight">
               <figure class="img-indent">
                  <img src="images/page1-img3.jpg" alt="">
               </figure>
               <h5><a href="services.html">CONSTRUCTION <br class="hide-tp">CLEANING</a></h5>
               Building sites, new build cleaning contracts. Anything that needs cleaned: give us a call!
            </div>
         </div>
      </div>
   </div>
</div>

Answer 1

没有看到你的CSS，我只是在猜测。我会说你可以尝试添加浮动：左边的div。此外，您应仔细检查您的边距和填充，以确保它们不超过允许的宽度。如果你有三个900px盒子，10px填充，宽度变为920px。

Answer 2

当你试图在水平规则中放置div数时，你必须定义float属性并将其设置为正确，否则它只会形成一个垂直结构...

转到你的css并在grid_8 class属性下定义：

.grid_8
{
float:right;
}

这会将它们排列在水平方向......

我不能让这些div水平显示

2 个答案: