Support » Theme: Fruitful » Override style.css

  • Resolved Slllobodan

    (@slllobodan)


    Hi, very nice theme, im trying to change some of the styles but having problems with overriding default style.css.

    Also i see a lot of “!important” tags in default css file, why so many and is there a way to override it?

    I tried using theme options css editor and also child theme, but none of them works!

    Its a local wp install so no plugins are installed.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter Slllobodan

    (@slllobodan)

    resolved

    Hi there,

    I’m not the author of the theme, but I should be able to help until the theme gets updated. A child theme is probably the best approach. Since you already have one, test and make sure it’s actually working by adding a random style to an element.

    Once you’re sure it’s working, the only way you’ll be able to override those parent theme styles with the !important declaration is to use the declaration yourself in the child theme.

    For example, the parent theme uses this CSS in its stylesheet:

    .main-navigation ul ul:hover > a {
        color:#333 !important;
        text-shadow:none !important;
    }

    To override that, you need to not only use the !important declaration, you also need to strengthen the CSS selector:

    .menu-wrapper .main-navigation ul ul:hover > a {
        color:#444 !important;
        text-shadow:1px 1px #000 !important;
    }

    You basically have to match the parent and then go one step further in CSS selector strength.

    Please note that this is not ideal. Important declarations should be avoided. But until the parent theme removes them, that is how you can override them.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Override style.css’ is closed to new replies.