Почему только 95%? (1-ое испытание)


#1

Все идеально подобрано же:

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

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

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

.block2 {
background: #f1c40f url(/assets/course13/cat_poo.png) no-repeat center center;
}

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

.block4 {
background: #3498db url(/assets/course13/cat_walk.png) no-repeat 230% center;
}

.block5 {
background: #3498db url(/assets/course13/cat_walk.png) no-repeat -100% center;
}

.block6 {
background: #27ae60 url(/assets/course13/cat_slippers.png) no-repeat center center;
}

.block7 {
background: #bdc3c7
}

.block8 {
background: #95a5a6 url(/assets/course13/cat_grumpy.png) no-repeat 150% center
}

.block9 {
background: #bdc3c7 url(/assets/course13/cat_grumpy.png) no-repeat -190% center
}


#2

Не идеально. В различиях посмотрите, двух котов неправильно “распилили”, у одного лишняя лапа получается, а у второго горб сверху. Если не видно, увеличьте масштаб страницы в браузере.


#3

А в идеале позицию котов в “%” задавать или в “px”?


#4

В пикселях точнее будет.


#5

вот 100%

.bg {
height: 300px;
background:
url("/assets/course13/cat_fish_128.png") no-repeat 90px 145px,
url("/assets/course13/cat_grumpy_128.png") no-repeat 15px 125px,
url(/assets/course13/cat_drunk_128.png) no-repeat 160px 125px,
url(/assets/course13/cat_walk_128.png) no-repeat 80px 80px,
url(/assets/course13/cat_academy.png) no-repeat 20px 20px,
url(/assets/course13/star.png) repeat-x 0 10px,
url(/assets/course13/star.png) repeat-x 0 270px
}


#6

100% в процентах.
.block1{
background: #000000 url(/assets/course13/cat_poo.png) no-repeat center;

}

.block2{
background: #f1c40f url(/assets/course13/cat_poo.png) no-repeat center;
}

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

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

.block5{
background: #3498db url(/assets/course13/cat_walk.png) no-repeat -115% ;
}

.block6{
background: #27ae60 url(/assets/course13/cat_slippers.png) no-repeat center;
}

.block7{
background: #bdc3c7;
}

.block8{
background: #95a5a6 url(/assets/course13/cat_grumpy.png) no-repeat 158%;
}

.block9{
background: #bdc3c7 url(/assets/course13/cat_grumpy.png) no-repeat -192%;
}