Using the custom.css code below, I’m succesfully overridding the css files of a commercial Joomla 3 Template.
div[itemprop="articleBody"] h1, h2, h3, h4, h5, h6 {
margin-top: 18px!important;
margin-bottom: 0px!important;
}
The custom.css should apply to:
<div itemprop="articleBody">
<h1><strong>Some Text</strong></h1>
<p> Some Text Some Text Some Text Some Text </p>
</div>
The problem is that the custom.css code is applied even to h tags outside the <div itemprop="articleBody">
container in all major browsers.
What could be the problem ?