无法使用IE8使用脚本设置marginTop样式,但适用于成年人浏览器

Question

我试图用脚本动画滑出菜单.要做到这一点,我需要动画marginTop元素的属性,并从增加它-30px来0px.

但是,在IE8中,动画根本不做任何事情.我已经追溯到这样一个事实,即marginTop脚本中的设置似乎没有任何效果.在Chrome和Firefox中,这很好用.

这是一个适用于Chrome/Firefox但不适用于IE的示例:

http://jsfiddle.net/rm58T/2/

这是一个IE错误,如果是这样,有这种行为的变通方法吗？谢谢!

更新:

这是一些错误的屏幕截图.

在Chrome中,我的小提琴看起来像这样(你可以看到"新菜单的名称"文字,因为我们用脚本改变了边距)

在IE8/Vista中,它看起来像这样.我可以在Developer Tools中确认topMargin实际上0px是预期的,但是元素没有被重新绘制:

另一个更新:

在Windows 7上运行的IE8上,以及在Windows 2008 Server上运行的IE8上,这个bug(至少对我来说)是个错误.它不会在WinXP上运行的IE7上为我重新编程.我没有任何IE9机器来测试它.

另一个更新:

我发现了一个潜在的解决方法.如果我设置p.newmenu为position: absolute;而不是position: relative;那么它的工作原理.但是,在我的情况下,我在弹出菜单中托管这一整个东西,需要这个控件来推出模态对话框的底部,所以绝对定位它不是一个选项.但是,也许这些知识可以帮助找到可行的解决方案.可以在此处找到此工作的一个示例.

你会相信另一个更新吗？:

我现在确实找到了解决方法.如果我使用top: -30px;而不是负上边距,那么一切正常. top但是,与边距的行为略有不同,并且使得UI看起来不那么好.特别是,当您使用时top: -30px,您的元素下将有30px的空白,因为相对定位不会影响其他页面流.

我非常想弄清楚为什么我不能像在其他浏览器上那样在IE上使用负上边距,所以我仍然希望有人可以提供一个答案,它将提供负上边距的所有好处但是也适用于IE8.

Answer 1

此行为的触发因素是 IE8 处理 fieldset 元素的方式。

您可以通过将字段集的显示设置为内联（或内联块）来解决此问题。

div.modal.addmenu fieldset {
   display: inline;   
}