mobile-styles.css overrides custom CSS

  • Resolved pstoaks

    (@pstoaks)


    11 years ago

    This problem is with Mantra 2.0.1. I am using a lot of custom CSS (input into the Mantra Settings -> Miscellaneous Settings CSS box) to customize the look and feel of my Mantra site. Overall, it’s working the way I need it to, but when Mantra transitions into “Mobile” mode, style-mobile.css trumps my settings, keeping me from customizing the behavior without modifying either the PHP or the mobile-styles.css file. In a few cases I’ve been able to overcome this by creating a more specific selector, but I have several cases where this isn’t possible.

    Is mobile-styles.css loaded by JS after the page is loaded? Is that why it wins all the time? I need some workaround. If the only answer is “hack the theme PHP or CSS files”, so be it. It won’t be the first time, I’m just wanting to avoid that for all the obvious reasons.

    Thanks,
    paul

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter pstoaks

    (@pstoaks)

    11 years ago

    My mistake. Just another nuance of CSS (the !important qualifier screwed me up.)

    Thread Starter pstoaks

    (@pstoaks)

    11 years ago

    Did anybody else read ‘!important’ as NOT important?

    Obviously the developers of the CSS spec were not ‘C’ programmers, or they would have put the exclamation point at the end! 🙂 Sheesh, I feel old.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years ago

    lol 🙂

    the.Zedt

    (@doryan-gray)

    10 years, 11 months ago

    The mobile CSS is loaded in the footer of the page, to make sure the mobile styling is the absolutely last one that applies so you can’t break responsiveness with absolute sizes unless you really want to 🙂

    yehonatan_naim

    (@yehonatan_naim)

    10 years, 2 months ago

    Hi,
    actually I’m having the same problem that you had,
    but I didn’t figure out how did you solve it.

    I did mantra-child theme which I have inside style-mobile.css
    but when i’m in mobile mode the style-mobile.css which load is from the father theme and not the child theme.

    how can i change it to load style-mobile.css from mantra-child. ?

    Thanks in advanced.
    Yehonatan Naim.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years, 2 months ago

    Please create a new thread here: http://wordpress.org/support/theme/mantra#postform

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘mobile-styles.css overrides custom CSS’ is closed to new replies.

Tags