Hello guys,
I am redesigning my homepage and while looking at the CSS I’ve noticed there are a lot of elements where I use
!important
Can somebody clarify me, how can I style the same element, once as general rule and once for a specific part without !important.
For example we have this HTML code:
...
<body>
<div id="wrap">
<p>Blah blah blah</p>
<p>Blah blah blah</p>
<p>Blah blah blah</p>
<p>Blah blah blah</p>
<div class="ticket">
<p>this is another paragraph</p>
<ul>
<li>item-1</li>
<li>item-2</li>
<li>item-3</li>
</ul>
</div> <!--/ticket-->
</div><!--/wrap-->
</body>
...
Now we use this CSS:
p {
margin:0 0 2em;
}
.ticket p {
margin:0;
}
margin properties of the second paragraph (child of .ticket) are not correct, only when I use:
.ticket p {
margin:0 !important;
}
Is there something wrong on how I’ve addressed this problem? How are all you experts doing this?
Thank you a lot!
Boby