Select ID and class at the same time in CSS in SharePoint 2013

Question

I have a page as blow:

<ul class="ms-cui-tabBody ms-cui-tabBody-or" id="Ribbon.EditingTools.CPInsert" role="tabpanel" aria-labelledby="Ribbon.EditingTools.CPInsert-title" unselectable="on">
...
</ul>

I want to select ID and Class at the same time in CSS. But it doesn't work when I add CSS code to page.

#Ribbon.EditingTools.CPInsert.ms-cui-tabBody{
height:78px!important;
background-color:green;}

How can I correct it?

Answer 1

You need to escape periods in your IDs. So your code would be something like this.

#Ribbon\.EditingTools\.CPInsert.ms-cui-tabBody 
{
    height:78px!important;
    background-color:green;
}