[nathtiekParticipant]

So far all the solutions I have seen are for site wide using custom CSS.

How do I change the font size and button size for a particular callout, without affecting the rest of the callouts in the site?

[Rue NelModerator]

Hello There,

Thanks for writing in! What we can recommend is to use a custom class for the column container of the callout element. Or you can make use of the section ID. Please edit your page in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

#x-section-1 .x-callout .h-callout{
    font-size: 26px;
}

#x-section-1 .x-callout .p-callout{
    font-size: 16px;
}

#x-section-1 .x-callout .x-btn{
    font-size: 12px;
}

Take note that we use #x-section-{ID}, this is very helpful so that the given code will only the callout inside the specified section. You can replace it with a custom class as well.

Hope this helps.

[nathtiekParticipant]

This reply has been marked as private.

[ThaiModerator]

Hi There,

Please provide us with your website URL so we can take a closer look.

Thank you.

[nathtiekParticipant]

stewardship.sg

[RupokMember]

Hi there,

Thanks for writing back. Upon checking your website I can see it’s responsive on a callout and other one is not – http://prntscr.com/akpzyo

So check and make sure you are using same structure for both of them .

Cheers!

[nathtiekParticipant]

Hi, it is not responsive. I’m trying the X Prompt Shortcode (the one above), and the X Callout Shortcode (the one below). Both of them are not responsive inside the sidebar. They don’t look right.

[LelyModerator]

Hi There,

There’s not enough space in the sidebar to display X Prompt element side by side. Please also try adding the following CSS code:

.x-sidebar .x-prompt-section.x-prompt-section-button {
    width: 100%;
    display: block;
}

That will fixed the X prompt although it will occupy the space for callout. Please note that sidebar space is limited and it is not recommended to add more content.

Hope this helps.

[Author]

Posts