触发点击Javascript事件时，IE8会将某些边距重置为0

I have 3 divs with content which get their visibility triggered by clicking on 3 buttons:

我有3个包含内容的div，通过单击3个按钮触发其可见性：

Sometimes when I click one of the buttons I get this:

有时当我点击其中一个按钮时，我得到了这个：

It's like some margins get reset to 0. Even the line-height and letter-spacing seem to reset. After clicking anywhere on the screen everything returns back to normal. Everything works fine on all other browsers.

这就像一些边距重置为0.即使行高和字母间距似乎重置。点击屏幕上的任何地方后，一切都恢复正常。在所有其他浏览器上一切正常。

Does anybody have an ideea why?

有人为什么会有这样的想法？

Thanks, Lucian

谢谢，卢西恩

1 个解决方案

#1

visibility:hidden/visible causes a repaint if you toggle it using a class reference, or a reflow if you toggle it using a style attribute.

visibility：hidden / visible如果使用类引用切换它，则会导致重绘;如果使用style属性切换它，则会导致重排。

Use a position:relative container to wrap each of the 3 divs. Make each of the 3 divs position:absolute. On click, add a class the sets top:-9999px.

使用position：relative容器来包装3个div中的每一个。使3个div中的每一个位置：绝对。单击时，添加一个类设置顶部：-9999px。

#1