负边距、z-index和点击阻塞

Question

负边距、z-index和点击阻塞

9

我正在使用负边距来布局两列：

<div id="left-column"><input type="checkbox" /></div>
<div id="right-column">
    <div id="right-column-inner"></div>
</div>

Css:

#left-column { width: 200px; float: left;}
#right-column { margin-left: -200px; width: 100%; float: left;}
#right-column-inner { margin-left: 200px; float: left;}

很遗憾，在Opera 10.54、Safari 4和FF 3+中，复选框无法点击，因为#right-column在复选框之前捕获了点击事件。

我尝试过操作z-index，但没有成功。

有什么想法可以让它工作吗？

- EoghanM

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Richard JP Le Guen · Accepted Answer

当你在CSS中更改定位属性（如top，left，bottom，right或z-index）时，必须指定一个position属性，而不是默认值static。

因此，请同时更改z-index和position CSS属性。

#left-column { width: 200px; float: left; position:relative; z-index:100;}