css - JQuery animate behaviour with inline-block elements -
i'm using jquery animate 2 divs, 1 on top of other, inside div. effect button top , bottom halves opening , down reveal contents. idea have number of these 'buttons' in line using float:left
when button clicked, script checks if button open, if so, closes button , opens clicked button.
this works fine, except want change float:left display:inline-block on container div class (to prevent wrapping of number of buttons if browser resized). problem layout of buttons breaks jquery animate seems changing vertical position of button containers while animating.
see fiddle
.btn{ display:inline-block; vertical-align:top; margin-left: 20px; } see fiddle
Comments
Post a Comment