Link在粘頁腳在Firefox和Chrome

我使用的是粘頁腳不可點擊狀中描述：Link在粘頁腳在Firefox和Chrome

我有，我想一個鏈接一個段落在頁面的底部，所以我把它放在.footer中。

問題是Firefox 3.5.2和Chrome中的鏈接不可點擊，它位於.push後面。它在IE7和IE8中工作，但我想這不會說太多。

我已經玩弄了Z指標，但那不起作用。順便說一句，我需要的位置：在#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>

來源

2009-09-08 jeroen

解決它，加入了現在的位置是：相對和Z-指標做到了：

.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; 
}

來源

2009-09-09 22:25:51 jeroen

是跨瀏覽器兼容的推動和頁腳類也需要相對的z-index的位置得到認可。 – 2009-09-19 14:42:15

請用奧斯汀的評論更新您的答案。它真的爲我節省了很多時間。 – 2013-09-22 20:29:24

@Johnny_D好點，我添加了它。 – jeroen 2013-09-23 05:30:50

我在webkit瀏覽器中遇到了類似的問題。設置z-index或位置並不能解決問題，但在設置-webkit-transform後：translate（0,0）;該按鈕可以再次點擊。

來源

2011-11-08 04:25:09 5566

糾正我，如果我錯了，但我認爲你應該添加一個負值z-index推回它啓用鏈接按鈕。

這爲我工作

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

來源

2013-11-12 14:07:09 Mithun

Link在粘頁腳在Firefox和Chrome

回答

相關問題