Highlighting in blue not working

Hi,

I’m trying to highlight in blue with html but it’s being a bit buggy:

I’m using html: <span style="background-color: #50e8e1">Next event</span> for example

https://ghromandie.ch/

Thanks

Hi Camille,

Thank you for reaching out to us. Instead of using HTML tags, please assign the background color via Headline element settings in Cornerstone (see screenshots)

Hope this helps!

Hi, thank you for your response. Unfortunately I do not want to to have the whole row background blue. I specifically would like to highlight the text in blue. Is there another way?

Hey Camille,

Another way of doing it is with custom CSS. To highlight the text only, you can add the following code in the Element CSS of your Headline element under Customize tab:

$el .x-text-content-text-primary {
    display: inline-block;
    background: #50e8e1;
}

Hope this helps!

It seems like the first h1 does not highlight even though i have added your css

However it shows in the builder

https://ghromandie.ch/

Hi Camille,

Can you try this approach instead without using CSS. Make sure to set Column Flexbox Layout to ON.

See this sample screencast: https://screencast-o-matic.com/watch/cq6ul7usNp

I don’t have the flexbox layout option

Hello Camille,

The Flex layout option in the column is only available if you are using the latest Row element.

Meanwhile, I have checked your site and the background color is displaying now.

Please check your site again.

Great, thanks, however now the title is not centering.

https://ghromandie.ch/

Hi Camille,

Please inspect your headline element and go to text alignment and set it to center.

Or you can use text alignment on your column’s setting as well.

Thanks!

It already is

Hello Camille,

Please click the Column and in the column settings, find the Setup and in the Flexbox layout turn it ON. You can then set the horizontal alignment to “center”.

We would love to know if this has worked for you. Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.