2075 / Bootstrap 5 / Сітка
<div class="container"> <div class="row"> <div class="col">1</div> <div class="col">2</div> <div class="col">3</div> </div> </div> На всю ширину container-fluid - на всю ширину Стрибки F12 sm - мобільні, горизонтально і вертикально md - планшет lg, xl, xxl - монітори <div class="container"> <div class="row"> <div class="col-4 col-sm-12 col-md-4 col-lg-3 col-xl-2 col-xxl-1" style="background-color:#DAF7A6;">1</div> <div class="col-4 col-sm-12 col-md-5 col-lg-6 col-xl-8 col-xxl-10" style="background-color:#1AF7A6;">2</div> <div class="col-4 col-sm-12 col-md-3 col-lg-3 col-xl-2 col-xxl-1" style="background-color:#DAF7A6;">3</div> </div> </div>
Сітка
Стовпчики
Відступи між блоками
Рядок row justify-content-center - по центру row justify-content-lg-center - після lg по центру Клітинка col py-2 - відступи по вертикалі col px-2 - відступи по горизонталі col d-flex justify-content-center - центр по горизонталі col d-flex align-items-center - центр по вертикалі