html - 网格列之间的分隔符

Question

如何在网格列之间添加分隔符。我尝试添加边框，但它总是破坏布局。请查看所附图片以便清楚理解。

编辑

看这里

http://burnfatweightlossblog.com/aiu/junaid/testhtml/

代码

<div class="container_12">
  <div id="footer">
    <div class="alpha grid_3 dabox"> </div>
    <!-- Box 1-->
    <div class="grid_3 dabox"> </div>
    <!-- Box 2-->
    <div class="grid_3 dabox"> </div>
    <!-- Box 3-->
    <div class="omega grid_3 dabox"> </div>
    <!-- Box 4--> 
  </div>
  <!-- footer--> 
</div>

Answer 1

在网格 div 内围绕您的内容放置一个包装器 div

HTML:

<div class="grid_4">
    <div class="columnDivider">
        contents here
    </div>
</div>

CSS:

.columnDivider {
    border-right: 1px solid #DEDEDE;
    margin-right:-10px; /* size of gutter */
    padding-right:10px; /* size of gutter */
}