html - Why my CSS is not overridden? -
<style type="text/css"> .x-container img { float: left; margin-right: 15px; } .content img{ clear:both; } </style> <div class="x-container span-18"> <div class="content"> <img src="image.jpg" id="disneland-img"> </div> <h2>hello</h2> </div> i have html above. expecting clear:both in .content img override float:left of .x-container img, not.
how can achieve please?
float , clear 2 distinct css declarations. don't override each other. (although relating to/influencing each other of course.) if want override float:left of first class can write:
.content img{ float:none; } clearing float thing, need use clear on sibling element, or put overflow:auto|hidden on parent element or apply called "clear-fix" method.
.clearfix:after { content:""; display:table; clear:both; }
Comments
Post a Comment