使用浮动位置时,CSS链接在表内无法点击

时间:2014-05-14 07:09:57

标签: html css

无法在表格中的图片上点击链接

<div id="1" class="title_page">
<a href="http://link.com">
<img width="450px" src="img/logo.png">
</a>
</div>
<div id="2" class="game_buttons">
<table class="gb_table" border="0" cellspacing="30" align="right">
<tr>
<td><a href="http://link1.com" target="_blank"><img src="logo1.png"></a></td>
<td><a href="http://link2.com" target="_blank"><img src="logo2.png"></a></td>
<td><a href="http://link3.com" target="_blank"><img src="logo3.png"></a></td>
<td><a href="http://link4.com" target="_blank"><img src="logo4.png"></a></td>
</tr>
</table>
</div>

我的CSS

div.title_page {
margin-top: 20px;
position: absolute;
z-index:1;
}
div.game_buttons {
    margin-top: 20px;
    margin-left: 10px;
    display: inline-block;
    float: right;
    z-index:10;
}

问题在于game_buttons类div

1 个答案:

答案 0 :(得分:1)

更新您的css,如下所示..

div.title_page {
margin-top: 20px;
position: absolute;
z-index:1;
}
.game_buttons {
margin-top: 20px;
margin-left: 10px;
display: inline-block;
float: right;
z-index:10;
position:relative;
}

以下示例JsFiddle。

http://jsfiddle.net/ZGa3w/