Как убрать пробел справа от div?

Question

Я создал структуру столбца с помощью начальной загрузки 4.Это выглядит примерно так: у него 1 строка с 2 столбцами:

  <div class="left">
        <hr class="container hline">
        <div id="main" class="container border">
            <div class="row">
                <div class="col-lg-5 top">
                </div>
                <div class="col-lg-5 top">
                /*Widget with too much margin right*/
                </div>
           </div>
       </div>
    </div>

Проблема в том, что виджет справа имеет слишком много пустого пространства.Столбцы имеют одинаковую длину (col-lg-5), но справа все еще остается много места.Как я могу удалить это и сохранить столбцы одинакового размера?

ссылка на codepen

Answer 1

Вы должны использовать только столбцы в своих строках, а столбцы основаны на сетке из 12 столбцов.В настоящее время ширина столбца составляет 10 столбцов 2 .col-5, а у вас также есть пиксель для разделителя, который вставлен в строку в коде, даже если ваш пример здесь не показывает его.

Как насчет того, чтобы сделать два .col-6 столбца и сделать разделитель левой границей на правом столбце?

https://codepen.io/anon/pen/xaeWGB

<div class="left">
    <hr class="container hline">
    <div id="main" class="container border">
        <div class="row">
            <div class="col-lg-6 top">
            </div>
            <div class="col-lg-6 divider top">
            </div>
       </div>
   </div>
</div>