Recently, I encountered an issue with Chrome. When I applied a z-index of -1 to a position: relative; unordered list, the links within it became unclickable.
You can see an example at http://jsfiddle.net/raLnx/ using Chrome 20.0.1132.47m.
There is no problem if both `ul` sections have a positive z-index. However, I believe this may be a bug in Chrome or there might be a better way to achieve what I need without using position: relative;.
Here is the snippet of CSS causing the issue:
ul.over {
height: 40px;
line-height: 40px;
border-radius: 5px;
background-color: #DDD;
border-bottom: 2px solid #AAA;
}
ul.under {
height: 35px;
padding: 0 30px;
background-color: #EEE;
line-height: 35px;
font-size: 90%;
position: relative;
bottom: 5px;
z-index: -1;
}
Any suggestions or ideas on how to solve this issue?