theme CSS seems to be loading after custom elementor CSS even with !important

  • Resolved sydneyvapelife

    (@sydneyvapelife)


    1 year, 5 months ago

    As the title states, on my landing page, the theme CSS seems to be loading after custom elementor CSS even with important code and does not reflect required outcome on mobile view live site, but preview is fine. Ive tried a few things like reloading critical CSS, purge all caches etc. This does not resolve it. I did however change to another theme (twenty twentyone) and the intended view come through as expected on live mobile view perfectly so it seems to be a theme issue which is overwriting custom CSS in elementor custom CSS field. Is there a way to change the loading sequence for this to have custom code fire after theme code? or possibly another avenue to explore?

    I’m essentially just trying to reduce the size of the H2 heading on mobile view.

    ive attached a screenshot of the mobile view preview with custom code and the actual live view (on the right)

    https://pasteboard.co/Cdt0ZiIdKFd3.png

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hello @sydneyvapelife

    No need to submit two tickets. ?? We’ll reply to the other one as it’s easier to keep things organised!

    Thank you.

    Thread Starter sydneyvapelife

    (@sydneyvapelife)

    ah sorry, no problem, wasn’t sure if maybe some one else on the forums had any similar instances they may have been able to shed some light on the situation.

    Ill wait for your reply on the other ticket then.

    Copy pasting the message for transparency. ??

    Hmm, ok. I can confirm this looks like a hiccup coming from our end and I have informed the developers about it to take a closer look and see what can be done.

    ?

    In the mean time, I would actually recommend something a little bit better for you. Instead of putting all of these paragraphs (even if they’re tagged as H2) in one text editor box, which has limited controls by default with Elementor, wouldn’t it be better to separate these into proper heading and text box elements, where needed?

    ?

    Check this video out – https://streamable.com/puv9xh – for a short demo on how you may want to do things. Notice that the heading element has direct controls for device types, which should work correctly.

    ?

    But in any case, I have notified the devs of the initial issue and I am waiting for an answer from their side.

    Hi @sydneyvapelife

    Copy pasting for transparency.

    Our developers are done with their research and unfortunately, we won’t be able to change this behaviour from our end due to multiple code implications. Indeed, some simpler themes do “work”, but they only work because they do not have a specific set of features provided by more feature-rich themes, such as a typography and colour management system.

    If you will give a few other themes a try, you’ll see that they experience the same behaviour.

    The correct way of doing things would indeed be the way that I have shown you – inserting specific blocks for each part of the website, which already have per-device controls and can be easily manipulated.

    Again, I’m really sorry but we won’t be able to do much in this case.

    Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘theme CSS seems to be loading after custom elementor CSS even with !important’ is closed to new replies.