24/33 Испытание морской Волк! 99% но много ошибок

Курсы §30. Рамки и фоны, часть 2
23

Кто бы это мог быть?:wink:

24

:thinking: :blush:

25

Наведите на путь истинный, получил 100% по заданию, посмотрел в теме, вроде сходится с решением большинства. Но по условиям задачи понятно что есть “косяк”, не соблюдено условие кратность “5”.

Стили:

/* 
Пути к изображениям

img/rope-frame.png
img/keks-2.jpg
img/eye-patch.svg

*/

.portrait {
    width: 275px;
    height: 275px;
    margin: 0 auto;
    box-sizing: border-box;
    background: url("img/eye-patch.svg"), url("img/keks-2.jpg");
    background-size: 80px, cover;
    background-position: 35px 35px, -9px 0;
    background-origin: content-box;
    background-clip: content-box;
    background-repeat: no-repeat;
    border: 50px solid;
    border-image: url("img/rope-frame.png");
    border-image-slice: 90 fill;
    border-radius: 50%;
}

Кратность не соблюдена в данном куске кода, а значит решение не верно!

background-position: 35px 35px, -9px 0;

Где ошибка, куда копать?!

26

Не переживайте, в 34 “мозги” не лучше работают)))

27

-9px 0 center

1 лайк
28

В 51 – не парюсь.:blush:

29

Спасибо!

:+1:

30

Мое творение, если не подгонять а перечитывать теорию, то начинаешь понимать как вся “кухня” работает, и результат не заставит себя ждать

.portrait {
width: 275px;
height: 275px;
margin: 0 auto;
border: 50px solid rgba(0,0,0,0);
border-radius: 50%;
border-image: url(“img/rope-frame.png”);
border-image-slice: 90 fill;
background: url(“img/eye-patch.svg”) no-repeat 35px 35px,
url(“img/keks-2.jpg”) no-repeat 50% 50%;
background-size: 80px, cover;
background-clip: content-box;
}

1 лайк
31

Перечитывая теорию не смог понять что делает border: 50px solid rgba(0,0,0,0);
Значение имеет только число пикселей… цвет и стиль рамки без разницы, лишь бы синтаксис не нарушался…