Custom Style not applied - demo website

#1

Hello,

I added a custom style per below:

.highlight {background-color: yellow;}

This became available in the dropdown menu. Within that menu, the text had a background colour of yellow. I had some content highlighted and selected this option from the menu. In the editor, the yellow background colour did not appear. I published the page then viewed the published page. The class name was applied to a SPAN tag around the content I had selected, but the actual styling (background colour) was not applied.

Is this simply because I was testing on the demo site? Have I missed something?

#2

The styles need to be added to your own stylesheet as well. The style in the Custom Styles dialog are just for preview. The key thing here is the class that’s being applied. These will do the same thing:

.your-class { }
.your-class { background-color: yellow; }

The result will be:

<span class="your-class">Example</span>