bootstrap максимальная ширина контейнера

Question

Можно ли установить max-width контейнера bootstrap с использованием настроек по умолчанию? (без изменения кода)

Я пытаюсь установить максимальную ширину контейнера на 540 пикселей, но правило css перезаписывается на 1140 пикселей;

Код:

<div class="container-sm">
  <div class="border border-primary">
    <p>This content should have max-width of 540px</p>
  </div>
</div>

Результат:

https://codepen.io/catalingavan/pen/NWGapKa

Answer 1

Контейнеры bootstrap (container-sm, container-md, container-lg, container-xs) меняют свою ширину в зависимости от типа используемого устройства и класса.

так в вашем случае - с вы используете container-sm, я просто создал переопределение

.container-sm {
    max-width: 540px;
}

изменил ваш кодовый блок - https://codepen.io/AbhijatSaxena/pen/GRpMWZr

(я бы также порекомендовал установить макс. ширина для других типов контейнеров, а также для согласованности)

Справка с сайта bootstrap