Hover not recognized on floating dynamically gener

Question

I am using bx Slider, using external controls for previous and next slide. All is working fine. However, I am using floating elements for the controls, since I want them in a line and filling the whole containing div (as in this question CSS three inline elements with align from left to right, how to occupy all available width )

However, the controls are generated dynamically by bxSlider, and for some strange reason, if the elements are floating hover is not recognized

Here is an example page: http://demitogroup.comuv.com/d_store/copia.html

If I turn the float off with firebug to #external_promo_controls div hover is recognized again.

If the links are not generated dynamically the problem does not show up.

On Chrome the same happens.

I have totally no idea about what is happening.

Could try to figure out something avoiding to use float elements, but then I will be back again to my first question...

Answer 1

If you expect your floated element to fill the whole space, try setting it to display:block explicitly, if it is not already. If that doesn't work, try setting a large z-index on it to guarantee nothing hidden is getting above it.