Сетка столбцов Bootstrap: проблемы с маржой

Question

Разбивая мои page.aspx на 4 columns, я замечаю в first и fourth columns несколько blank пробелов (на стороне left и right соответственно), таким образом сужение width столбцов second и third.

Зная способ избавления от таких проблем margin по умолчанию в first и fourth columns, чтобы get правильные одинаково сбалансированные столбцы по всему page.aspx будут высоко оценены.

Чтобы лучше проиллюстрировать такую ​​проблему, я написал следующий код:

<link rel=stylesheet href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<div>
  <nav class="navbar">
    <div class="img">
      <img src="...">
    </div>
    <div class="img">
      <img src="...">
    </div>
  </nav>
</div>

<div class="container">
  <div class="row">
    <div class="col-md-3" style="font-size:16px">
    </div>
    <div class="col-md-3 border-left">
    </div>
    <div class="col-md-3 border-left">
    </div>
    <div class="col-md-3 border-left">
    </div>
  </div>
</div>

Answer 1

Это из-за контейнера, который вы используете, вам нужен container-fluid, у которого нет полей, нет отступов, нет ничего, ха-ха.

container дает каждому div определенную фиксированную ширину, что причина пробелов

Вы можете проверить документацию здесь: Документация