I have: HTML\[code\]<div class="home-product-display-box"> <div>Lots of other stuff</div> <div class="fb-home-holder"> <div class="fb-like" data-href="http://stackoverflow.com/questions/14045209/www.myurl.com" data-send="false" data-layout="button_count" data-width="50" data-show-faces="false" ></div> </div></div>\[/code\]CSS\[code\].home-product-display-box .fb-home-holder { position:absolute; top:5px; right:5px; display:none;}.home-product-display-box:hover .fb-home-holder { display:block !important;}\[/code\]This works as intended for Webkit (Chrome and Safari), but does not work for Firefox and Internet Explorer. I intend to hide the Facebook div and show it on hover over the parent element, but it doesn't show. Why does this not work properly for these two browsers?
CSS3 :hover effect for child element - Firefox and Explorer doesn't work
- Thread starter mbrusse
- Start date