9/20 Не могу понять где, ошибка, при проверке зависает

Курсы §18. Селекторы. Часть 2
1

Пришлось усилить свойство с помощью !important, при проверке всё виснет, подскажите , что не так сделал ?

html,

body {
margin: 0;
padding: 0;
font-family: “Arial”, sans-serif;
}

body {
min-width: 550px;
min-height: 250px;
padding: 10px;
}

.cards {
width: 500px;
}

.cards li::before {
font-family: “Courier”, monospace;
}

li:not(.nine) {
margin-left: -15px;
}

li:not(.nine) {
width: 36px;
height: 54px;
}

.nine {
margin-right: 30px!important;
margin-left: 15px!important;
}

.ace.diamond,.eight.diamond,.ten.diamond,.six.diamond,.queen.diamond {
background-color: #0099ff;
}

.seven:not(.club) {
background-color: #ff3300;
}

ul:nth-last-of-type(1) li:nth-of-type(3n) {
background-color: #339933;
}

image
image.png1280×1024 377 KB

2

Вот здесь подробно разбирала это задание.

3

Я думаю наши коды похожи, только с разным решением, мне интересно почему мой не проходит систему, единственное явное различие это то что я не отменял наложения на первые карты строк
(li:not(.nine) {
margin-left: -15px;
})

4

Во-первых, перед !important нет пробела - это правило у вас точно работает?

5

Да , здесь пробел не влияет на работу !important, а вот без (!important) св-во не работает

6

Скорее всего проблема возникла именно потому, что Вы пытаетесь избежать использования nth-child (хотя использование именно этих селекторов и прорабатывается в этом и предыдущих заданиях).

Содержимое окна мини-браузера уже имеет определенную стилизацию, подключенную отдельно, помимо той, которую Вы задаете с окошке CSS. Видимо, Ваша стилизация, заданная просто через класс, конфликтует с CSS-правилом на стороне сервера. В итоге Вы пытаетесь “перебить” его через !important, но это в корне неверный подход.

Попробуйте переписать все CSS-правила, используя именно селекторы группы nth-child.
За исключением, конечно, тех, которые уже были указаны в исходном коде.

7

Спасибо, за объяснение ) , а вообще что скажете про код? Он верный ?

8

Сложно что-то сказать про код из этого задания - ведь кроме селекторов все уже было прописано в исходном коде. Ну а если только о селекторах - то про nth-child я уже писала, с ним Вы пока не подружились)