html - IE水平列表: Last element is mysteriously offset

Question

我遇到一个问题，IE 9(可能还有其他版本)无法正确显示我的水平列表。如您所见，最右边的元素被向下推了一点。

HTML:

<div id="contentBlock">
    <ul id="Bubbles">
        <li id="First">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip...
        </li>
        <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip...
        </li>
        <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip... 
        </li>
        <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip... 
        </li>
    </ul>
</div>

CSS:

ul#Bubbles li {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin:0px;
    margin-top:6px;
    margin-left:6px;
    padding:5px;
    background: #444; /* for non-css3 browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#333)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #555,  #333); /* for firefox 3.6+ */
    background: linear-gradient(#555, #333);
    background: -ms-linear-gradient(#555, #333);
    -pie-background: linear-gradient(#555555, #333333);
    float:left;
    width:225px;
    height:250px;
    font-size:12px;
    padding-top:3px;
    list-style-type:none;
    display:inline;
    position:static;
    /*behavior:url(PIE.php);*/
}

#Bubbles {
    width:956px;
    margin:0px;
    display:inline;
}

ul#Bubbles li#First {
    margin-left:0px;
    width:223px;
}

#contentBlock{
    height:270px;
}

我正在使用 IE9 版本的 CSS3PIE 进行背景渐变，但目前在这些元素上禁用它。任何帮助表示赞赏。谢谢。

Answer 1

通过删除列表周围的 div 解决了这个问题。谢谢。