Как настроить boostrap3 colum для ширины 70px

Question

Я пытаюсь настроить boostrap colum на ширину 70px. Теперь у меня есть столбец col-lg-1 шириной 64,984 пикселей, мне нужно 70 пикселей. Как это сделать в Boostrap 3. Я использую стандартный контейнер 1170.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<div class="container">
  <div class="row">
    <div class="col-lg-1">I am 64px width block</div>
    <!-- /.col-xl-1 -->
  </div>
</div>

Answer 1

Если вы хотите, чтобы при вызове col-xl-1 ширина составляла 70%, перейдите в файл bootstrap.css.Найти col-xl-1 и изменить

.col-xl-1 {
  width: 64.984px%;
}

на

.col-xl-1 {
  width: 70%;
}

Answer 2

Сетка Bootstrap основана на flexbox.Все, что вам нужно сделать, это добавить пользовательский класс и установить атрибут flex-based.

.custom {
  flex-basis: 70px;
}

<div class="container">
    <div class="row">
        <div class="col-xl-1 custom">I am 64px width block</div><!-- /.col-xl-1 -->
    </div>
</div>

Answer 3

Вы можете установить ширину вручную следующим образом:

<div class="col-xl-1" style="width:70px"></div>