One div out of several identical divs positioning differently in FF and IE

One div out of several identical divs positioning differently in FF and IE

Here is a link to the site. If you look at the 3 colored boxes, they are a
series of identical divs. The only difference is the webkit animation I
use on their load, but they all should end up in the same spot. The blue
and orange ones position correctly across browsers. The green one is about
20 px too low in IE & FF however. I find that when I fill in the green box
with more text it positions correctly, but that's a pretty lame solution.
What is causing this issue to happen? All the divs have the same pre-set
height, and everything else about them is identical.