Having trouble overriding responsive.css

  • Hi,

    I’v been working on a child theme where i need to modify some elements of responsive.css

    I have found topic where theme author gives a tip to copy whole css directory to child theme and i did it. Unfortunatly that does nothing

    if i look at the source code there is no reference to child-theme/css/responsive.css

Viewing 6 replies - 16 through 21 (of 21 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    So what happens if you put this in your Child Theme style.css file:

    @media screen and (max-width:620px) {
    .secondpost {
        width: 50%;
    }
}

    ??

    Thread Starter tipshunter

    (@tipshunter)

    i tried that and nothing happens. if i look at page source in my browser responsive.css loads after style.css

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Okay, so all you need to do is use more specific selectors don’t you?
    Very basic example:

    @media screen and (max-width:620px) {
    html .secondpost {
        width: 50%;
    }
}

    Thread Starter tipshunter

    (@tipshunter)

    oh man…i forgot about that. It works! ?? Thanks for taking time

    What do you think about my idea i mentioned above? any drawbacks? because that worked too

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    A bit unnecessary, loading a new stylesheet and putting the CSS in there for the same outcome. Plus an extra http request causes your server more strain

    I had the exact same problem and inputting a more specific selector (just adding ‘html’) fixed it. Thank you!!!

Viewing 6 replies - 16 through 21 (of 21 total)
  • The topic ‘Having trouble overriding responsive.css’ is closed to new replies.

Tags