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.

  • 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. – user3262111 Jun 17 '16 at 1:42
  • How to make my style loads before the default style? Is there another solution than using !important? – Luis Garcia Jun 17 '16 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. – user3262111 Jun 17 '16 at 1:56

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.

  • 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. – Luis Garcia Jun 17 '16 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 Jun 17 '16 at 16:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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