I came across a very interesting issue in IE9. When using filter: alpha(opacity=) or -ms-filter css property on a wrapping div the box model of the inner block elements get corrupted. In other words the collapsing of vertical-margin gets disabled and vertical-margin is added instead. I'm facing this issue only in IE9. IE7/8 is not affected.
Here's a jsFiddle with the isolated issue. Use the trigger anchor to activate the class that includes filter: alpha on the wrapping div. (IE9 only)
Any ideas why this is happening?
Thanks in advance
opacity
works in IE9, and doesn't cause the glitch. So, using the filter only in an[if lt IE 9]
commented style could be a work around.