Курс Фоны - проблемы "испытание"


#1

Поясните не понимаю
котов шесть
линков пять
ячеек девять
цветов семь

Так блоков-то сколько задавать?
вот такое вот решение

.Block1{
background:url("/assets/courset13/cat_poo.png ")no-repeat px px  #000000;
}

.Block2{
background:url("/assets/courset13/cat_hiss.png ")no-repeat px px #f1c40f;
}

.Block3{
background:url("/assets/courset13/cat_wa1k.png ")no-repeat px px #e74c3c;
}

.Block4{
background:url("/assets/courset13/cat_slippers.png ")no-repeat px px #3498db;
}

.Block5{
background:url("/assets/courset13/cat_grumpy.png ")no-repeat px px #27ae60;
}

.Block6{
background:url("/assets/course13/cat poo .png")no-repeat px px #bdc3c7;
}

.Block7{
background:url(" ")no-repeat px px #95a5a6;
}

хоть сколько-то близко к правильному?
Позиционирование в чем все таки предпочтительнее? в процентах?


#2

Названия классов должны быть с маленькой буквы.

Это недопустимый синтаксис. Если не указываете конкретных значений, то и px писать не нужно.


#3

OK!
Пусть с маленькой буквы названия классов и не указываем без конкретных значений px
но вопросы мои все равно без ответов

.block1{
background:url("/assets/courset13/cat_poo.png ")no-repeat   #000000;
}

.block2{
background:url("/assets/courset13/cat_hiss.png ")no-repeat  #f1c40f;
}

.block3{
background:url("/assets/courset13/cat_wa1k.png ")no-repeat  #e74c3c;
}

.block4{
background:url("/assets/courset13/cat_slippers.png ")no-repeat  #3498db;
}

.block5{
background:url("/assets/courset13/cat_grumpy.png ")no-repeat  #27ae60;
}

.block6{
background:url("/assets/course13/cat poo .png")no-repeat  #bdc3c7;
}

.block7{
background:url(" ")no-repeat  #95a5a6;
}

#4

Опечатка. Нужно course13.

Непрвильный путь с пробелами.

Так тож не сработает :wink:


#5

У-пс
не courset13
а
course13


.body{
width:300px;
height:0;
padding:0;
padding-top:15px;
font-size:0;
text-align:center;
background-color:white;
}

.block{
display:inline-block;
width:90px;
height:90px;
margin-bottom:1px;
margin-right;1px:
background-color:black;
}

.block1{
background:url("/assets/course13/cat_poo.png ")no-repeat   #000000;
}

.block2{
background:url("/assets/course13/cat_hiss.png ")no-repeat px px #f1c40f;
}

.block3{
background:url("/assets/course13/cat_wa1k.png ")no-repeat  #e74c3c;
}

.block4{
background:url("/assets/course13/cat_slippers.png ")no-repeat  #3498db;
}

.block5{
background:url("/assets/course13/cat_grumpy.png ")no-repeat  #27ae60;
}

.block6{
background:url(" ")no-repeat  #bdc3c7;
}

.block7{
background:url(" ")no-repeat  #95a5a6;
}

.block8{
background:url(" ")no-repeat;
}

.block9{
background:url(" ")no-repeat;
}

#6

Помимо оставшихся ошибок, задействовать в решении надо все 9 блоков.


#7

Каких еще оставшихся?
кокретнее!
и потом я и спрашивал как раз
про несоответствие количества линков
и кол-ка блоков

разясните
не ну ладно кот номер четыре из двух картинок
допустим и что это дает?


#8

Последние два квадрата тоже из двух картинок.


#9

устранено


#10

не углядел pardone

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


#11

Нужно локально смотреть в чём именно проблема. Предполагаю, что тема браузера перезаписывает стили.


#12

Ну вот тут-то не переписывепет почему-то

может потому что линки-то в html части кода?


#13

.block1 {
background:#000000 url("/assets/course13/cat_poo.png") no-repeat 50% 50%;

}

.block2{
background:#f1c40f url("/assets/course13/cat_poo.png") no-repeat 50%
50%;
}
.block3 {
background:#e74c3c url("/assets/course13/cat_hiss.png") no-repeat 50% 50%;
}
.block4 {
background:#3498db url("/assets/course13/cat_walk.png") no-repeat 60px 50%;
}
.block5 {
background:#3498db url("/assets/course13/cat_walk.png") no-repeat -30px 50%;
}
.block6 {
background:#27ae60 url("/assets/course13/cat_slippers.png") no-repeat 50% 50%;
}
.block7 {
background:#bdc3c7;

}
.block8 {
background:#95a5a6 url("/assets/course13/cat_grumpy.png") no-repeat 41px
50%;
}
.block9 {
background:#bdc3c7 url("/assets/course13/cat_grumpy.png") no-repeat -50px 50%;
}