爲什麼沒有CSS腳註鏈接工作？

我是一名開發人員，但現在我需要修復一個css錯誤。我有一個角度的應用程序。頁腳中有一些通用鏈接。但他們不再可點擊。爲什麼沒有CSS腳註鏈接工作？

這裏是我的html代碼

<!doctype html> 
<html lang="en" ng-app="example"> 
<head> 
    <meta charset="UTF-8"/> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Globalization Resource Center</title> 
    <link rel="stylesheet" type="text/css" href="./style.css"/> 
<body> 
    <div id="content"> 
     <div class="container-fluid"> 
      <div class="row-fluid" ng-view></div> 
     </div> 
    </div> 
    <div id="footer"> 
     Copyright Text goes here. 
     <a onclick="window.open(this.href);return false;" href="http://www.google.com" title="Privacy Policy"> Example Link</a> | 
     <a href="mailto:[email protected]" title="Contact Us">Contact Us</a> 
    </div> 
</body> 
</html>

這裏是style.css中

#content { 
    position: relative; 
    width: 100%; 
    height: auto !important; 
    min-height: 100%; 
    padding-bottom: 54px; 
    margin: 0 auto -54px; 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
     -ms-box-sizing: border-box; 
     -o-box-sizing: border-box; 
      box-sizing: border-box; 
} 

.container-fluid { 
    padding-right: 20px; 
    padding-left: 20px; 
    *zoom: 1; 
} 

.row-fluid { 
    width: 100%; 
    *zoom: 1; 
} 

#footer { 
    height: 54px; 
    margin: 0 auto; 
}

我剝離下來的代碼，並把它放在plunker在： http://plnkr.co/edit/Upvm5A7ksGT3mzXIcXTp

來源

2014-05-14 Joan Yin

「A」標籤不支持onclick。 –

刪除或位置：親戚;或保證金

來源

2014-05-14 16:35:51 keypaul

您的margin: 0 auto -54px;規則正在造成這種情況。頁腳鏈接最終位於內容之下。請修復保證金或添加z-index到頁腳：

jsFiddle example

來源

2014-05-14 16:38:51 j08691

謝謝！它現在有效。 –

的問題是，這是造成兩兩件事同時發生的

padding-bottom: 54px; 
margin: 0 auto -54px;

組合。首先，您的<div id="content">正在向下滑動，並下跌#footer。

二，你的填充只是在#content裏面加入相應的空格。這不是針對#footer。

這涉及到另外一個問題 - 因爲#footer默認情況下position:static，但#content爲position:relative，#footer是按位置順序呈現在公文流轉，不反對通過#content傳達的位置。

所以你有兩個<div>件簡單重疊，這意味着你不能點擊鏈接，因爲#content吸收這些點擊。

至於你的問題的解決方案，你可以簡單地削減54px/-54px完全，因爲你的#footer內容大概會反對#content。

或者您可以將#content和#footer設置爲相同的位置類型，static或relative。

鑑於我無法看到您的其他內容，我不知道您要尋找的整體佈局的最佳解決方案。

來源

2014-05-14 17:22:26 TiltedListener

爲什麼沒有CSS腳註鏈接工作？

回答

相關問題