在IE中有两个不同浮点数的li的宽度，在FF中是正确的

Question

我用我正在努力创造的“熔岩灯”效果解决了大部分问题。基本上我想要两个花括号（都是图像）来包装列表项，然后继续下一个列表项。我总是用FF构建，然后为IE做例外。我无法弄清楚我需要做什么例外！

我正在使用包含两个li的绝对定位div。第一个div向左浮动，第二个向右浮动。 li的宽度设置为它应该包装的li的宽度。从而在文本的左侧和右侧创建大括号的效果。它在Firefox中运行得很漂亮，但IE有两个问题：

1. 图像的底部被切掉。有时它们会在动画结束时重新出现，有时则不会。我认为这与身高有关，但不管我设定的高度是什么，都会失败！
2. 宽度完全错误。

以下是它的实例：http://jsbin.com/odome/2

IE中的左侧位置总是比FF高5-7px，但这是一个小的差异。我更关心被修剪图像的宽度和底部。

一如既往地感谢您的帮助！

Answer 1

您应该使用CSS reset使列表具有跨浏览器的行为。

Answer 2

1）您的ul＃selection-test未正确“清除”

2）看起来你不想要你的李包裹，所以添加一个白色空间：nowrap

3）意见：我不知道如何使用li＃blob作为灯泡中的熔岩。如果是我，我会做这样的事情

<div id="menu">
  <ul id="selection-test">
    <li>Menu Item One</li>
    <li>Menu Item Two</li>
    <li>Menu Item Three</li>
  </ul>
  <div id="lava">
    <div id="lava-left"></div>
    <div id="lava-right"></div>
  </div>
</div>