Почему не получается переписать оригинальное свойство импортируемого css?

Question

[beduin01]

В файл site.css импортирую css фреймворк. Затем пытаюсь переопределить отступ для подзаголовка. Выглядит это так:


Однако почему-то в отладчике это свойство отмечено как перечеркнутое, хотя оно по идее должно было перезаписать свойство оригинала. Ну и соответственно ничего не работает. Размер отступа остается старым.

Что делаю не так?

Answer 1

[walder]

margin-bottom: .1rem !important;

Comments

[beduin01]

поясните плиз, почему надо делать именно так?

[walder]

Играет роль в том случае, когда пользователи подключают свою собственную таблицу стилей. Если возникает противоречие, когда стиль автора страницы и пользователя для одного и того же элемента не совпадает, то !important позволяет повысить приоритет стиля.

тут можете прочитать подробней: htmlbook.ru/css/%21important

Answer 2

[AngReload]

По нормальному должны быть такие селекторы:
.subtitle, который задаёт отступ-снизу для всех subtitle и
.subtitle:last-child который отменяет отступ-снизу для последнего subtitle

У вас селекторы почему-то были организованы наоборот, так что есть правила:
.subtitle — который работает только для последнего элемента, так как после него есть селектор отменяеющий его для всех остальных
.subtitle:not(:last-child) да-да этот, поищите его ниже в CSS, если его изменить, то изменятся и все .subtitle. Но это правило применяется и к другим элементам, так что лучше создать отдельное правило после него.

Answer 3

[Cocorico]

.subtitle:not(:last-child) применяется к этому диву, потому что кроме него есть и другие дочерние элементы и в данному случае псевдоклассы :not(:last-child) добавляют специфичности:
https://codepen.io/overveg/pen/qyQOKN

:not не добавляет специфичности, а :last-child - да

"The negation pseudo-class :not is not considered a pseudo-class in the specificity calculation. But selectors placed into the negation pseudo-class count as normal selectors when determining the count of selector types."
https://developer.mozilla.org/en-US/docs/Web/CSS/S...

Можно попробовать заменить :last-child на :nth-of-type

Answer 4

[Mikhail Osher]

https://developer.mozilla.org/en-US/docs/Web/CSS/S...