负余量“悬停”div属于后期元素

时间:2012-02-04 17:44:09

标签: html css hover z-index margin

好的,所以我有三个<ul>个标签,每个标签都应用了float: left;<li>标记具有:hover规范,导致它们的宽度增加并获得等于宽度增益的负边距,因此在悬停时它们会增加大小而不会移动任何内容。

问题在于,它们不会延伸到以下浮动的<ul>标记,而是扩展到它们之下。设置z-index似乎没有对此做任何事情,尽管我可能错误地使用它。我尝试在z-index: 5;规范上设置:hover,我也尝试在后续z-index: 3;上设置z-index: 2;z-index: 1;<ul>标签,但没有任何区别。

做了工作的一件事是让<ul>标签为float: right;,以便最后一个实际上是最左边的,但我不喜欢这个解决方案因为这意味着我的代码与页面上显示的代码顺序相反,这意味着我必须在所有内容上设置手动tabindex属性来修复Tab键顺序。

编辑:修正了它; 7小时内无法回答我自己的问题,但事实证明z-indexposition: static;(默认)元素不起作用。我刚刚将position: relative;添加到<li>代码中,现在工作正常。

1 个答案:

答案 0 :(得分:1)

您不能将z-index用于静态元素。请考虑将其定位更改为relativeabsolute