Linkedin Follow Button在Firefox中无法正常显示

Question

我已在隐藏元素中设置了Linkedin Follow按钮，因此只有当您悬停图标时，隐藏元素才会显示，并显示按钮。

问题是在Firefox v35.0.1中，关注者编号不会显示在同一行上，就好像同一行上没有足够的空间一样。看看照片：

当我期待源代码时，似乎iframe在变为可见的时刻（悬停时​​）设置宽度和高度，然后（在模糊时）其宽度/高度设置回0。 Chrome iframe具有恒定的宽度/高度，在悬停时不会发生变化。

我尝试使用css设置iframe宽度，但这并不起作用，因为当我预期代码时，它会在Linkedin iframe中出现另一个iframe而内部iframe又有错误的尺寸。

有什么想法吗？

更新：当我将包装元素设置为可见时，一切都很好，所以这似乎会导致问题，但我该如何解决？

更新2：您可以自己查看问题：link（确保在Firefox中打开它！）

编辑：有人编辑我的帖子删除了它的Linkedin标签，但我真的相信这比他们的问题还要比Firefox或CSS更多，因为他们的javascript中有一些东西增加了按钮的宽度/高度iframe并添加错误。同样在IE中出现同样的问题。我添加了两次按钮 - 第一次是原样，第二次是在一个可见的包装中，显而易见的是，在可见的包装中一切都没问题，但隐藏的包装中断了。

更新3：我意识到按钮iframe宽度与其#body元素＆＃39; min-width：57px＆＃39;相同，所以如果Linkedin团队更正{{1让我们说min-width这可以解决这个问题。

Answer 1

问题在这里：

在firefox中，加载的宽度在元素中是2px，但在webkit（chrome和opera）中是106px。

样式的宽度不足以在一行中显示元素。 这是答案：

    .social-details {
    width: 195px;
    /* float: left; */
    position: absolute;
    left: -120px;
    top: -7px;
    background-color: white;
    padding: 11px 10px 8px 10px;
    z-index: -1;
    border-radius: 5px;
    visibility: hidden;
}

和

#social .social-linkedin:hover .social-details {
visibility: visible;
}

允许元素加载宽度为106px，并且对用户隐藏。