列表项左侧的光盘显示在底部

Question

发生了什么的屏幕截图:

它只是一个无订单列表中的列表项,这发生在IE7中,而不是其他地方.

<ul>
  <li>Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text.</li>
</ul>

.fancybox-entry.computer-policy li {
    float:none;
    width:100%;
    list-style-type:disc;
    margin-bottom:10px;
}

.fancybox-entry.computer-policy ul + p {
    margin-bottom:20px;
}

.fancybox-entry.computer-policy ul {
    margin:5px 0 10px 25px;
}

任何帮助,为什么它这样做,修复得到赞赏.

Answer 1

似乎宽度CSS属性触发liIE7中元素的hasLayout .首先尝试删除width:100%;声明以确保子弹出现在正确的位置.如果你不能没有width属性,你可以使用position: relative;和vertical-align: top;将子弹移回原位,如http://www.gunlaug.no/tos/moa_26.html所述.

请注意,该页面上的代码使用hacks来定位IE6和IE7.我推荐使用条件注释,如下所示:

<!--[if IE 7]>
  <style type="text/css" media="screen">
    /* IE7-specific CSS here */
  </style>
<![endif]-->