Блочная модель документа / Как отцентровать элемент? [11/23]
×

Как отцентровать элемент? [11/23]

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

  1. Задать элементу ширину, которая меньше ширины родительского контейнера.
  2. Задать для внешних отступов справа и слева значение auto.

Примеры кода:

selector {
    width: 100px;
    margin: 0 auto;
}

selector {
    width: 100px;
    margin-left: auto;
    margin-right: auto;
}

Выполнить задание
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Как отцентровать элемент?</title> <link rel="stylesheet" href="/assets/course9/style1.css"> </head> <body> <div class="block">Блок 1</div> </body> </html>
CSS
body { padding: 20px; } .block { height: 96px; line-height: 96px; text-align: center; }
HTML Academy
  1. Задайте блоку ширину 96px.
  2. Отцентруйте блок.
Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.