在Twitter中合并两个CSS盒子引导程序

问题描述：

嗨，我是HTML，CSS和bootstrap的初学者。我在创建以下框时遇到问题。在Twitter中合并两个CSS盒子引导程序

而这里就是我实现它

这里的网站是我的HTML

<div class="no-margin col-xs-12 col-sm-8 col-md-8 body-holder"> 
    <div class="col-md-2 col-sm-2"> 
     <img alt="" class="img-responsive" src="assets/images/arrow_up.png" class=""> 
    </div> 
    <div class="col-md-8 col-sm-8"> 
     <div class="upper-body"> 
      <p> 
       Departing from Omaha, NE, USA - 09-Sep-2015 5:40 PM 
      </p> 
     </div> 
     <div class="lower-body text-right"> 
      <p> 
       Arriving at Madison, NE, USA - 10-Sep-2015 12:30 PM 
      </p> 
     </div> 
    </div> 
    <div class="col-md-2 col-sm-2"> 
      <img alt="" class="img-responsive" src="assets/images/arrow_down.png"> 
    </div> 
</div>

如果你有更好的方法，这将是更好然后和蔼告诉我。在此先感谢

那么你可以说你是目前面临的问题？我想你已经实施了截图。 –

我想添加合并他们就像他们在背景颜色的图像，但在我的HTML和CSS他们不合并他们有他们之间的空间，你会看到当你不注重元素他们 – usama

答

可能这会帮助吗？

<table> 
<tr> 
    <td style="background-color:grey" rowspan=2> 
    <div> 
     <img alt="" class="img-responsive" src="assets/images/arrow_up.png" class="">    
    </div> 
    </td> 
    <td style="background-color:grey"> 
     <div class="upper-body"> 
      <p> 
     Departing from Omaha, NE, USA - 09-Sep-2015 5:40 PM 
      </p> 
     </div> 
    </td> 
    <td style="background-color:white" rowspan=2> 
     <div> 
      <img alt="" class="img-responsive" src="assets/images/arrow_down.png"> 
      </div> 
    </td> 
</tr> 
<tr> 
    <td style="background-color:white"> 
     <div class="lower-body text-right"> 
     <p> 
     Arriving at Madison, NE, USA - 10-Sep-2015 12:30 PM 
     </p> 
     </div> 
    </td>   
</tr> 
</table>

而且你可以使用一些CSS有跨越表格单元格一些填充，使它看起来按照您的要求

谢谢，我会尽力让你知道在5分钟 – usama

感谢他解决了我的问题... – usama

在Twitter中合并两个CSS盒子引导程序

相关推荐