Works in Custom CSS, but not frontend

  • EXAMPLE

    In Custom CSS, the buttons say “Call now!”.

    Here is the code:

    .deals-button.btn-small span { display:none!important; }

.deals-button.btn-small:after { content:'Call now!'!important; }

    … but upon loading frontend, it does not show.

    Any idea why? Solution?

    Thank you

    [Moderator note: Please don’t bump]

Viewing 14 replies - 1 through 14 (of 14 total)
  • Thread Starter CustomizrLuvr

    (@customizrluvr)

    Anyone?

    Which button are you talking about ? And you DO NOT add text via CSS. You do it with HTML.

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    See the small black squares?

    In Custom CSS, using the code above, they say “Call now!”

    but the page only shows blank button

    This is you html structure for blank button, notice there’s “See Deal” present but not showing.

    <div style="content: "call now";" class="green deals-button btn-small"><a href="https://contactexperts.net/deals/jmgfkjhgblk/"><span>See Deal</span></a></div>

    currently it’s being hidden by CSS. You could just change the text like this –

    <div style="content: "call now";" class="green deals-button btn-small"><a href="https://contactexperts.net/deals/jmgfkjhgblk/"><span>Call now!</span></a></div>

    Since it’s being hidden, you need to add this CSS code to show the text

    .deals-button.btn-small span {display:block !important;}

    Let me know if that worked out for you

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    I added that CSS code, and it still does not show.

    How to change HTML?

    Adding that CSS alone won’t do the trick, You need to change your HTML structure of that page as well. If you haven’t done this before you might well stay away from modifying it.

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    I have edited plugins before. Only thing is I cannot find this HTML segment.

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    It is working, only the button got big. How to make normal size?

    EXAMPLE

    Try this:

    .deals-button.btn-small {
  margin: 0px 5px 0px !important;
  padding: 0px !important;
  width: 30%;
}

.deals-more-content .deals-more-price-box {
    padding: 0.50em;
}

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    Does not work.

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    It requires PHP to change HTML.

    Not strictly true @cl. The code was added using CSS (see top post)

    Does Not Work. Does that mean at all? Do you see any change?

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    There was small change with the margins, but essentially no effect.

    PHP snippet to replace “See deal” (original) with “Call now!”.

    Thread Starter CustomizrLuvr

    (@customizrluvr)

    I should have just asked for PHP in beginning.

    The weird thing is CSS displays perfectly in backend, but not frontend.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Works in Custom CSS, but not frontend’ is closed to new replies.