Робота з блочними елементами

Блочні елементи мають прямокутну форму та розташовуються один над одним, не дозволяючи іншим елементам знаходитися на тій же лінії. Ця поведінка визначається CSS-властивістю display: block.

Основні характеристики блочних елементів:

• За замовчуванням мають display: block;
• Їхня ширина займає всю ширину батьківського контейнера;
• Висота визначається вмістом, але може бути змінена за допомогою CSS;
• Завжди починаються з нового рядка;
• Властивості, такі як border, margin, padding, width та height, можна налаштовувати.

Розглянемо приклад, у якому змінюються width, height та margin:

Розглянемо, як можна вирівняти елемент по центру всередині його батьківського елемента.