html element in component : sample.cmp
<div class="slds-text-heading--large heading">
Activity Dashboard
</div>
sample.css
.THIS .heading{
padding: 1rem;
border-bottom: 2px solid #d2522a;
position: fixed;
width: 100%;
z-index: 1000;
background: #f9f9f9;
}
I have include this component in a lightning app. The problem is, above css is not applied to the div with class 'heading'. Also, it is not shown in Google chrome console styles. I had to add inline style to the div to make it work. But I cannot add inline css to every element because this is happening with other elements too. Am I missing something?