Magento: переопределить класс CSS в мой пользовательский файл CSS

Question

У меня есть кнопка с именем ' Запросить дополнительную информацию ' с кодом, как показано ниже, и ее классом css 'plp-description-request-btn', который поступает из main.css (Кожа \ оболочка \ тема \ умолчанию \ CSS \ main.css)

<a href="javascript:void(0);" class="plp-description-request-btn">Request More Info</a>

приложение \ дизайн \ фронтенд \ тема \ умолчанию \ расположение \ page.xml

<action method="addItem"><type>skin_css</type> <name>css/custom.css</name></action>

Мне нужно переопределить класс css для определенного элемента из main.css в мой файл custom.css (\ skin \ frontend \ theme \ default \ css \ custom.css)

Я попробовал что-то вроде ниже в моем файле custom.css, но это не отражает

.plp-1col-container .plp-description-request-btn{
    background-color: #cb9b36; 
    color: red;
    border: 2px solid #cb9b36;
    transition: .2s cubic-bezier(.15,.9,.5,1);
    margin-right: 7px;
}

Answer 1

Использование! Важный должен быть последним средством. Первое, что вы должны проверить - загружен ли CSS вообще. Тогда, если это так, но оно переопределено, это может быть просто вопросом специфичности цели.

Проверьте эту страницу для получения дополнительной информации: https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

Answer 2

Думаю, вам лучше внести изменения в исходный файл CSS, но если это не вариант, попробуйте:

.plp-1col-container .plp-description-request-btn{
    background-color: #cb9b36 !important; 
    color: red !important;
    border: 2px solid #cb9b36 !important;
    transition: .2s cubic-bezier(.15,.9,.5,1) !important;
    margin-right: 7px !important;
}