Відступ першого рядка (властивість text-indent), css - приклади

успадковує значення батька

Що таке text-indent CSS

Позитивне значення властивості text-indent визначає довжину відступу першого рядка елемента. Негативне значення - довжину виступу.

Значення text-indent у відсотках встановлює відступ або виступ першого рядка елемента у відсотках від ширини елемента.

Новий рядок в HTML: як зробити відступ першого рядка абзацу

Розбивати текст на абзаци слід за допомогою тега

.

У тега

можуть бути такі дочірні елементи [w3.org]. a, abbr, area, audio, b, bdi, bdo, br, button, canvas, cite, code, data, datalist, del, dfn, em, embed, i, iframe, img, input, ins, kbd, keygen, label, map, mark, math, meter, noscript, object, output, progress, q, ruby, s, samp, script, select, small, span, strong, sub, sup, svg, template, textarea, time, u, var, video, wbr.

І всі ці дочірні елементи дружно відсуваються, перебуваючи на першому рядку.

Незручно, що властивість успадковується і у inline-block елементів теж присутній відступ зліва до вмісту. На inline елементи воно не поширюється, так як має бути поставлено лише блоковим елементам.

Заборонити спадкування text-indent

Тепер властивість не успадковується і у inline-block елементів відсутній відступ зліва до вмісту.

Відсувати тільки текст нового рядка абзацу

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

Замість text-indent можна використовувати margin для псевдоелемента. first-letter.

Пропозиція після картинки не зміщений, так як першою літерою першого рядка блоку передує інший елемент рядка.