Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/actionscript-3/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 在Firefox和Chrome中无法单击粘性页脚中的链接_Html_Css_Firefox_Webkit - Fatal编程技术网

Html 在Firefox和Chrome中无法单击粘性页脚中的链接

Html 在Firefox和Chrome中无法单击粘性页脚中的链接,html,css,firefox,webkit,Html,Css,Firefox,Webkit,我使用的是粘性页脚,如中所述: 我想在页面底部有一个带有链接的段落,所以我把它放在了.footer中 问题是,在Firefox 3.5.2和Chrome中,这个链接是不可点击的,它已经落后了。它在IE7和IE8中确实有效,但我想这并不能说明什么 我曾玩弄过z索引,但那不起作用。顺便说一下,我需要position:relative in#page来定位该div中的某些内容 是否有办法使.footer中的链接在所有浏览器中都可单击? 守则的有关部分: css html, body {

我使用的是粘性页脚,如中所述:

我想在页面底部有一个带有链接的段落,所以我把它放在了.footer中

问题是,在Firefox 3.5.2和Chrome中,这个链接是不可点击的,它已经落后了。它在IE7和IE8中确实有效,但我想这并不能说明什么

我曾玩弄过z索引,但那不起作用。顺便说一下,我需要position:relative in#page来定位该div中的某些内容

是否有办法使.footer中的链接在所有浏览器中都可单击?

守则的有关部分:

css

html, body {
    height: 100%;
}
#page {
    width: 962px;
    text-align: left;
    min-height: 100%;
    /* sticky footer part */
    height: auto !important;
    height: 100%;
    margin: 0 auto -90px;
    /* end sticky footer */
    position: relative;
}
/* sticky footer part */
.push, .footer {
    height: 90px;
}
.push {
}
.footer {
    background: #181f18 url(../images/background-top.png) no-repeat center bottom;
}
html

<div id="page">
  <div id="wrapper">
    <div id="contents">bla bla</div>
  </div>
  <div id="footer">bla bla</div>
  <div class="push"></div>
</div>
<div class="footer">
    <p><a href="http://www.some-site.com/">Some Text</a></p>
</div>

布拉布拉
布拉布拉


解决了它,添加了一个position:relative和z-indexes:

.push, .footer {
    height: 90px;
    position: relative;
}
.push {
    z-index: 9000;
    position: relative;
}
.footer {
    background: #181f18 url(../images/background-top.png) no-repeat center bottom;
    z-index: 9999;
    position: relative;
}

我在webkit浏览器中也有类似的问题。设置z索引或位置并没有解决问题,但在我设置-webkit转换后:translate(0,0);该按钮可再次单击

如果我错了,请纠正我,但我认为您应该为z-index添加一个负值,它会将其推回启用链接按钮

这对我有用

.footer, .push {
    height: 4em;
    position: relative;
    width: 90%;
    margin: 0 auto;
    z-index: -9000;
}

要实现跨浏览器兼容,推送和页脚类还需要相对位置才能识别z索引。请使用Austin的评论更新您的答案。这真的节省了我很多时间。