0

I've already extended some styles from Blank theme, however I haven't been able to override styles from class:

.footer.content ul > li

In my theme, I created a custom block in the footer. I can see in firebug that my CSS rules are loaded, however they are not applied since the default magento class .footer.content ul > li takes priority over my styles.

If I disable the styles in firebug from .footer.content ul > li then my styles are applied.

3
  • You need to make sure that your style is loading before the default style. Easy way to test this is to use !important and see if the default style is being overridden by your styles. Commented Jun 17, 2016 at 1:42
  • How to make my style loads before the default style? Is there another solution than using !important? Commented Jun 17, 2016 at 1:54
  • This was just a test. If your style override was successful. Then look in your head styles file and make sure that your style sheet is below the default stylesheet. Commented Jun 17, 2016 at 1:56

1 Answer 1

0

You might take into consideration the priority of CSS selectors. This is described in official docs: http://www.w3.org/TR/CSS21/cascade.html#specificity

For example you can try:

body .footer.content ul > li

This should give your custom style higher priority than style from theme package.

2
  • Since .footer.content ul > li is a default magento style, I can't edit it or remove it (or I don't know how to do it). So I would like to override that style but I haven't found a way to do it. Commented Jun 17, 2016 at 15:24
  • You should write that style in your custom CSS file. Just use full "body .footer.content ul > li" descriptor to describe your class path.
    – Amasty
    Commented Jun 17, 2016 at 16:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.