Отступ

Расстояние между элементами. В CSS их два вида: padding — внутри блока, от края до текста, и margin — снаружи, от блока до соседей. Отступ сообщает связи: то, что стоит близко, читается как одно целое, а то, что далеко, — как разное.

Как это выглядит: .card { padding: 18px; margin-bottom: 24px; } ┌─────────────┐ ← padding: край → текст │ текст │ └─────────────┘ ↕ margin: до соседа

Не путать: Отступ — не «пустое место, которое надо заполнить». И не путать padding с margin: padding увеличивает сам блок и красит его фон, margin отодвигает блок от других и остаётся прозрачным. Ещё одна ловушка: у соседних блоков margin не складывается, а «схлопывается» — берётся больший.

Откуда слово: От «отступить» — «шагнуть в сторону, отойти». Тот же корень у «наступление» и «выступ». В типографике слово сначала значило красную строку: абзац «отступал» от края. В CSS оно стало техническим термином — и до сих пор путает новичков, потому что вид отступа бывает двух разных видов.

Где это проходят: урок 2.2 «Отступы: снаружи и внутри» · Интерфейсы и сайты с нуля

Весь словарь программиста — 135 слов с объяснениями, примерами и ссылками на уроки.