Adding multiple CSS class to Rich text editor Sitecore 8

Question

I am trying to add CSS classes to Rich text editor in Sitecore 8. I have included the reference to the CSS file in the web.config as below

<settings>
  <setting name="WebStylesheet">
    <patch:attribute name="value">/Stylesheets/Corporate/rte.css</patch:attribute>
  </setting>
</settings>

My CSS class looks something like this:

.utility.background-color-dark-blue:focus, .utility.background-color-dark-blue:hover {
  background-color: #034b76;
  color: #fff;
}
.utility.background-color-dark-grey {
  background-color: #1a1b1f;
  color: #fff;
}

When I select the CSS class from the dropdown of RTE it only applies "background-color-dark-grey" class to the element. I need to apply the CSS class as "utility background-color-dark-grey" to display the correct styling.

Anyone know how add multiple classes to RTE in sitecore ?

Answer 1

Can you update Sitecore's validator to remove Dot(.) special character? I guess the class name is the value of list item (/sitecore/templates/System/Html Editor Profiles/Html Editor List Item) in Editor Profile and basically sitecore doesn't allow add Dot(.) on the value field.

There would no error exception in rendering this CSS file, but Sitecore ignores the special characters when presenting the list which contains multiple class names with Dots(.).