Twitter Bootstrap 3.0 rc1 не используется желобов между определенными столбцами

Question

.rounded-box(@border; @radius; @bg-color: transparent; @padding: 5px 10px) { 
    border:1px solid @border; 
    .border-top-radius(@radius); 
    .border-bottom-radius(@radius); 
    .border-left-radius(@radius); 
    .border-right-radius(@radius); 
    background-color: @bg-color; 
    padding: @padding; 
} 

У меня есть подмешать создание закругленной угловой коробки, в скриншоте ниже, вы можете увидеть, что это не имеет никакого промежутка между каждым DIV, который имеет .make- столбец (4), применяемый к каждому.

* Я включил bootstrap.less в свой основной файл меньшего размера и запустил lessc для компиляции, и это на снимке экрана, который вы видите, больше 990 пикселей. Любая помощь приветствуется.

@rounded-box-radius: 10px; 
@rounded-box-border: #ccc; 
@rounded-box-height:230px; 
@box-bg-color: #eee; 

.article { 
    .make-column(4); 
} 

.promo { 
    .make-column(4); 
    .visible-lg; 
    .rounded-box(@rounded-box-border, @rounded-box-radius); 
    height: @rounded-box-height; 
} // promo end 

HTML

<div class="promo"> 
    Promo 
</div> 

<div class="article"> 
    <h3>Blog Entry 1</h3> 
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
    consequat. Duis aute irure dolor.</p> 

    <div class="date">March 23, 2013</div> 
    <div class="read-more"><a href="blog-detail.php" title="read more on this title">Read more</a></div> 
</div> 

<div class="promo"> 
    Promo 
</div> 

Answer 1

Я думаю самозагрузки 3 использует отступы для разделения колонок вместо полей. Ваша граница обтекает весь элемент, включая дополнение. Возможно, вам понадобится предоставить свои собственные правила полей для разделения столбцов вместо заполнения, чтобы получить рамки с разделителями между ними.

Answer 2

@jtlowe находится прямо в https://stackoverflow.com/a/18127896/1596547 про обивку. Но применение правил маржи в ваших столбцах приведет к разрыву сетки (из-за того, что поля добавляются по ширине).

Используйте дополнительный контейнер, так же, как здесь: need spacing between divs using twitter bootstrap v3 (дубликат ??)

HTML

<div class="promo"> 
    <div class="rounded-box">Promo</div> 
</div> 

менее

.rounded-box(@border; @radius; @bg-color: transparent; @margin: 5px 10px) { 
    border:1px solid @border; 
    .border-top-radius(@radius); 
    .border-bottom-radius(@radius); 
    .border-left-radius(@radius); 
    .border-right-radius(@radius); 
    background-color: @bg-color; 
    margin: @margin; 
    height:@rounded-box-height; 
} 

Примечание применять высоту (@rounded -box-height) и замените прокладку с помощью поля