Firefox2显示:带位置的内联块破解:相对不工作

Firefox2显示:带位置的内联块破解:相对不工作,firefox,css,Firefox,Css,有人能告诉我是否有可能在Firefox2(以及IE6)中实现这一点吗? 我能够用“-moz inline stack”hack模拟内联块,但是它似乎忽略了position:relative,因此内联堆栈容器中具有绝对位置的元素不会相对于它们应该出现的位置出现。。相反,它们位于FF2页面的右上角 我知道FF2已经过时了,我可能不应该在意,但我想知道是否有办法实现这一点,而且我需要它在IE6中工作 谢谢。不幸的是,我不再有FF2来为您测试这一点,但我认为在这方面工作的唯一方法是嵌套一个div并应用

有人能告诉我是否有可能在Firefox2(以及IE6)中实现这一点吗?

我能够用“-moz inline stack”hack模拟内联块,但是它似乎忽略了position:relative,因此内联堆栈容器中具有绝对位置的元素不会相对于它们应该出现的位置出现。。相反,它们位于FF2页面的右上角

我知道FF2已经过时了,我可能不应该在意,但我想知道是否有办法实现这一点,而且我需要它在IE6中工作


谢谢。

不幸的是,我不再有FF2来为您测试这一点,但我认为在这方面工作的唯一方法是嵌套一个div并应用相对于嵌套div的位置,以便它位于您的内部
li

至于IE6,我认为对你的黑客程序的修改也应该适用于它

更改:

 .item {
   list-style-type: none;
   height: 50px;
   width: 50px;
   position: relative;
   border: 1px solid teal;
   background: #00f;
   display: -moz-inline-stack; /* for FF2 */
   display: inline-block;
   /* <ie hacks> */
   zoom: 1;
   *display: inline;
   min-height: 50px;
   _height: 50px; /* for ie6 */
   /* </ie hacks> */
}
display:inline
规则放在一个单独的规则集中意味着您不需要
zoom
,它应该适用于IE6和IE7。 我只是移动了min height hack使它们保持在一起;)-顺便说一句,我不知道为什么你有最小高度,因为你已经有了一个更高的高度规则,第二个高度规则(我删除了)只是在重复,所以也许你不需要IE6最小高度黑客反正

 .item {
   list-style-type: none;
   height: 50px;
   width: 50px;
   position: relative;
   border: 1px solid teal;
   background: #00f;
   display: -moz-inline-stack; /* for FF2 */
   display: inline-block;
}

.item {/** IE Hacks **/
  display: inline !ie7; /* should work for 6 as well */
  _height: 50px; /* IE6 */
}