Here is a CSS code snippet that I am struggling with:
.select,
.input,
.schedule,
.editableFields
{
cursor: pointer;
background-color: blue;
}
However, the above code overrides this one:
#past .layer.color {
background-color: #E5D403 !important; /*this needs to be the first priority color*/
}
EDIT: I want the second background-color to override the first one. I have tried various solutions like using IDs, classes, and !important, but nothing seems to work. Any help would be appreciated! (I'm also using Twitter Bootstrap with all CSS rules in custom.css).
I even tried adding inline CSS to the HTML. Here is just a portion of it:
<div class="accordionGroups">
<div class="accordionHeading">
<a class="accordion collapsed" data-toggle="collapse"
data-parent="#mainAccordion" data-target="#collapseThree"> <i
class="twistyIcon"></i> Layers
</a>
</div>
<div id="collapseFirst" class="accordion-body collapse">
<div class="accordion-inner scrollable">
<ul id="layers-dropdown-menu">
<li><label class="checkbox" id="past"> <span class="layer color legend"></span> Past
</label></li>
When I tried setting background-color:#E5D403 inline, it produced an error.
Another attempt that failed was:
.checkbox span .layer.color.legend
{
background-color: #E5D403 !important;
}