9/18 почему на картинке всё ок а не проходит?

Курсы §14. Мастерская: декоративные элементы
1

на картинке все нормально как бы - а вот даже 90 процентов не проходит

 <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Испытание: карточка курса</title>
    </head>
    <body>
        <div class="fon">
 <span class="font-size"> Курс &laquo;Фоны&raquo;</span></br>
        <span class="text">Учимся использовать</br>
        фоновые цвета и</br>
        изображения, разбираемся с</br>
        форматами,знакомимся с</br>
        приёмами создания</br>
        декоративных эффектов.</br></span>
        
 <div class="social">
<a href="#" class="btn fb"></a>
<a href="#" class="btn tw"></a>
<a href="#" class="btn g"></a>
</div>       
    </body>
</html>

CSS:

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;
}
.fon{
    
   
   padding-left:20px;
   padding-top:20px;
    display:inline-block;
    height:230px;
    color:white;
  background:#1abc9c;  
    width:225px;
    
    
    }
.font-size{
    position:absolute;
    top:40px;
    font-size:20px;
        }
.text{
     position:absolute;
     top:80px;
    }    

/*
Все размеры, отступы, координаты, размеры шрифтов (не заданные в body) кратны 5 или 10.
Адрес картинки-спрайта:
/assets/course14/social-challenge.png
*/
.btn{ 
    
   margin-bottom:-180px; 
display:inline-block;
width:30px;
height:30px;
margin-right:5px;
background:#16a085 url("/assets/course14/social-challenge.png")no-repeat
}
.fb{
background-position: 0 0;
}
.tw{
background-position: -30px 0; 
}
.g{
background-position: -60px 0px;

2

Без вашего варианта HTML-кода разобраться не смогу. Вставьте его сюда с помощью кнопки </>

3

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;
}
.fon{

padding-left:20px;
padding-top:20px;
display:inline-block;
height:230px;
color:white;
background:#1abc9c;
width:225px;

}
.font-size{
position:absolute;
top:40px;
font-size:20px;
}
.text{
position:absolute;
top:80px;
}

/*
Все размеры, отступы, координаты, размеры шрифтов (не заданные в body) кратны 5 или 10.
Адрес картинки-спрайта:
/assets/course14/social-challenge.png
*/
.btn{

margin-bottom:-180px;
display:inline-block;
width:30px;
height:30px;
margin-right:5px;
background:#16a085 url("/assets/course14/social-challenge.png")no-repeat
}
.fb{
background-position: 0 0;
}
.tw{
background-position: -30px 0;
}
.g{
background-position: -60px 0px;

4

HTML-код покажите, пожалуйста. СSS у меня уже есть.

5

вчера очистил код так что нету html кода .даваите оставим это мучение :wink:

6

А давайте вы его быстренько восстановите)) Там не так и много писать) Не будем лениться :wink:

7

спасибо просто сечас занят другими курсами и реально устал

8

Ineska ты модератор или ученик как и я? -почему спрашиваю -просто хотелось бы завести дружбу с коллегой по курсамм

9

Ученик я) Пишите на почту, адрес есть в профиле.

1 лайк
10

зашел на профиль .не вижу адресс

11

Странно. Надо будет проверить настройки…
inusia91@mail.ru