Добрый день!
Не могу найти ошибку, почему не прописовывается спрайт.
Как только я задаю селектор background-repeat:no-repeat; изображение пропадает. Тоже самое с background-position.
`добавьте 4 символа пробела, перед форматированным текстом`
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Испытание: карточка курса</title>
</head>
<body>
<div class="big">
<p>Курс «Фоны»</p>
<br><div class="a">Учимся использовать фоновые цвета и изображения, разбираемся с форматами, знакомимся с приёмами создания декоративных эффектов.
</div>
<div class="b">
<a class="social vk" href="/assets/course14/social-challenge.png"></a>
<a class="social tw" href="/assets/course14/social-challenge.png"></a>
<a class="social gl" href="/assets/course14/social-challenge.png"></a>
</div>
</div>
</body>
</html>
html, body {
margin: 0;
padding: 0;
}
body {
width: 280px;
min-height: 280px;
padding-top: 20px;
padding-left: 20px;
font-size: 14px;
font-family: "Arial", sans-serif;
line-height: 1.2;
background: #ecf0f1;
}
/*
Все размеры, отступы, координаты, размеры шрифтов (не заданные в body) кратны 5 или 10.
Адрес картинки-спрайта:
/assets/course14/social-challenge.png
*/
.big{
background-color:#1abc9c;
color:white;
width:240px;
}
p{
display:inline-block;
margin-left:20px;
margin-top:20px;
font-size:140%;
}
.a{
margin:0 20px;
}
.b{
margin:20px;
padding-bottom:15px;
}
.social {
display:inline-block;
width:30px;
height:30px;
background-color:#16a085;
margin-right:10px;
background-image: url("/assets/course14/social-challenge.png")
background-repeat:no-repeat;
}
.vk{
background-position:0 0;
}
.tw{
}