Оформление текста, часть 2 / Испытание: поиграйся со шрифтами Padding-left вместо text-indent?

html,
body {
min-width: 570px;
height: 300px;
margin: 0;
font-family: “Arial”, sans-serif;
color: #ffffff;
background: url(“football.jpg”) 50% 50% no-repeat;
}

h1 {
position: relative;
width: 320px;
margin: 0;
padding-left: 40px;
font-weight:normal;
text-transform:uppercase;
font-size:80px;
line-height:100px;
letter-spacing:40px;
word-wrap:break-word;
text-shadow:-5px 5px rgba(0,0,0, 0.5)
}
h1:first-child::first-letter{
padding-left:100px;
}

h1::before {
content: “|||”;
position: absolute;
top: -5px;
left: -55px;
text-indent:100px; можно здесь использовать padding-left?
font-size:55px;
font-weight:bold;
text-shadow:none;
letter-spacing:4.7px;
}

Можно, поскольку контент псевдоэлемента состоит из одной строки. Но почитайте, чем отличаются эти два свойства.

Спасибо, разницу понял. Если бы это был текст состоящий больше чем из одной строки, тогда бы влево сдвинулся весь текст, а не первая строка!

1 лайк