Custom CSS not working

  • Resolved wpprup

    (@wppraesenz)


    3 months ago

    Hello, I love your plugin and I am using it for years.
    Now I face the problem, that the custom CSS does not work: it does not change the text size of the title of a spolier, no matter which parameter (pt, em, px and size) I am changing, it stays stubbornly stable and small in the same size.
    I am not a coder. ??

    .su-spoiler.my-custom-spoiler > .su-spoiler-title {
    /* Text Size */
    font-size: 48px;
    }

    This is the code you offered in the plugin. I put it into the custom css settings of the plugin and “played” with the parameters. With no effect, unfortunately.

    Even adding the 

     !important

    to it did not change anything.

    Is there anything wrong with it?
    (I certainly cleared the browser cache and the website cache each time I changed something)
    Thanks for a hint what is to change.
    Best wishes

    • This topic was modified 3 months ago by wpprup.
    • This topic was modified 3 months ago by wpprup.
    • This topic was modified 3 months ago by wpprup. Reason: new information

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

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

  • I don’t work for them, but am using this plugin.

    Maybe you know this already, but the CSS you need to add should be put in Appearance/Customize/Additional CSS.

    Try this? ▼

    .su-spoiler.my-custom-spoiler > .su-spoiler-title {
    /* Text Size */
    font-size: 48px !important;
    }

    Hope this helps! If I’m wrong, then forgive the intrusion. ??

    Thread Starter wpprup

    (@wppraesenz)

    @styzer
    Thank you very much for your efforts! Very kind of you to answer instead of the plugin devs! ??
    I placed the code everywhere – with and without !important – in any place where one can add Custom CSS: the plugin itself, the Snippets plugin or the place you suggested, too. The title is but not willing to change. Not in Chrome, not in Firefox, zero change of the font size.
    Nevertheless best wishes and thanks again! ??

    No problem. I know what it is to wait on very busy tech support…

    So this is exactly the code they gave you?

    .su-spoiler.my-custom-spoiler > .su-spoiler-title {
    /* Text Size */
    font-size: 48px !important;
    }

    What if you removed the first bit and only put:

    /* Text Size */
    .su-spoiler-title {
    font-size: 48px !important;
    }

    Or try it without the (/*Text Size*/) within the code itself. It’s not usually best practice to put text comments inside the code, usually you place it before? I could be wrong, but I would never do this.

    ??

    • This reply was modified 2 months, 2 weeks ago by styzer.
    • This reply was modified 2 months, 2 weeks ago by styzer.
    Thread Starter wpprup

    (@wppraesenz)

    @styzer : Yes, this exactly was the code they offered. The text comments were not the problem, I deleted them already. But your code worked!
    Now I read the documentation again and I realized, I missed the first step:

    Add custom CSS class to your shortcode:

    [su_spoiler class="my-custom-spoiler"] ... [/su_spoiler]

    After doing that, I put the CSS code in question into the Custom CSS field in the plugin settings (advantage of this place is, that if I deleted the plugin the code will be deleted, too).
    And now it works, too!
    You helped a lot. Your code would work and I was forced to check whether my cited code was really right… It was right but another thing was missing… ?? ??
    Thanks again, mate!!
    Being able to read and reading documentations carefully, helps. I will hopefully have that in mind in the future. Or call styzer. ?? <3

    Ah, great to hear! ?? Thanks for letting me know! I sometimes spend a lot of time trying all kinds of CSS permutations to force an outcome that doesn’t happen. Code can be finicky. Glad to have helped!

    Regards,

    styzer

    • This reply was modified 2 months, 2 weeks ago by styzer.
Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.