Question

http://jsfiddle.net/seXjp/

If you mouse over “one” “two” or “three” you’ll see a menu pops up from each.

When they’re animating up the right hand side seems to be cut off about 10px.

When they’ve finished, suddenly those 10px come back!

Any ideas why this happens?

Thanks

Answer 1

You have some box model errors.

The width of .upmenu ul should be 110px (100px + 2*5px padding of .upmenu li) and the .upmenu ul li should have no horizontal padding when using width: 100%.

Here an Update

edit

In fact you are using centered text, you could also set the horizontal padding to 0 for .upmenu li and you will be fine using 100px or 100% width’s.