html - Css 删除列中的边距或填充

Question

使用 bootstrap 3 删除列填充或边距以创建平铺效果

  <div class="row">
  <div class="col-md-4">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>
<div class="col-md-4">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>  
<div class="col-md-4">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>

  //row 2
  <div class="row">
  <div class="col-md-4">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>
<div class="col-md-4 col-md-offset-2">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>  
<div class="col-md-4">
    <div class="hexagon-wrapper hex_size">
        <div class="hexagon">
        </div>   
    </div>      
</div>

到目前为止的结果:

我需要一个类来添加到行以将第二行推高 50%。它似乎被 Bootstrap 覆盖了。

Answer 1

你可以使用转换，比如

.row.moveup{
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50px%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

See it in action here

(我也对您的 html 结构进行了一些小的修改)

另外，你可能想看看at this question