Support » Theme: The Bootstrap » [Theme: The Bootstrap] @media in child theme doesn't take effect

  • Resolved anyway


    I’m trying to override

    @media (max-width: 767px) {
    .container {
    width: auto;
    padding: 0 10px;

    in original style.min.css, width

    @media (max-width: 767px) {
    #page-footer .container {
    padding: 0 20px !important;

    in childtheme style.css.

    It seems that any attempt to override @media-styles in childtheme css doesn’t take effect. What I’m doing wrong?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Same, when I omit “#page-footer”, by the way …

    That’s strange: It is working, when I write the styles directly in the head.

    All other overrides I did in my childtheme style.css are working. Only, the media queries are not. The file is being loaded after the original stylesheet.

    Did anybody ever have the same problem?

    Theme Author Konstantin Obenland


    Code Wizard

    What browser do you use?

    In general, media queries behave the same way as all CSS and can be overridden. The Bootstrap overrides many Bootstrap media queries.

    Thank’s for reply, Konstantin.

    Yes, I know that it should be possible. I’ve worked a lot with child themes before.

    It is the same in all browsers. If you never heard of this problem before, it must be something strange with my files.

    Okay, I got it. It was an not easy to find bug in my CSS file. Stupid, but true. Sorry for the unnecessary posting and your patient support, Konstantin.

    Any news about that? I have the same problem…

    As I wrote already… it was a bug in my own childtheme CSS. It had nothing to do with the theme, or with CSS generally. It was something like a missing semicolon. For a simple test, put your @media stuff to the top of your css file. If it works then, something on the way between is interrupting your css.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘[Theme: The Bootstrap] @media in child theme doesn't take effect’ is closed to new replies.