a href 在推送的页脚中不起作用答案

【问题标题】：a href doesn't work in a pushed footera href 在推送的页脚中不起作用
【发布时间】：2012-11-21 21:15:26
【问题描述】：

我想在该页脚中放置一些无法正常工作的链接。似乎它们不可点击，我不知道为什么会这样。

页脚本身位于站点的末尾，并且将被推送的 div 强制留在底部。我的整个 div 排列是这样的：

<body>
<div class="wrapper">
    <div class="push"></div>        
</div>
<div class="footer">
<div id="about">
    <div id="list">
        <span class="up">1. row</span>
        <ul class="nav">
            <li><a href="/one.php">one</a></li>
            <li><a href="/two.php">two</a></li>
            <li><a href="/three.php">three</a></li>
            <li><a href="/four.php">four</a></li>
        </ul>
    </div>
</div>
<div id="legals">
    <div id="list2">
        <span class="down">2.row</span>
        <ul class="nav2">
            <li><a href="/five.php">five</a></li>
            <li><a href="/six.php">six</a></li>
            <li><a href="/seven.php">seven</a></li>
            <li><a href="/eight.php">eight</a></li>
        </ul>
    </div>
</div>

example

为什么这个 href 不起作用？

好的，谢谢大家。在这种情况下添加 z-index 不起作用，因为添加它时，由于在该类中使用了另外几个其他 z-index，因此不会显示包装器的全部内容。所以解决方案是删除位置：相对。感谢您的帮助！

【问题讨论】：

标签： html css hyperlink href

【解决方案1】：

在您的.wrapper 中添加z-index:-1

像这样

.wrapper{
z-index:-1;
}

Demo-one

--------

或者第二个选项是

删除 position:relative在这个类.wrapper

Demo

【讨论】：

【解决方案2】：

问题是您的类push 的元素与您的页脚重叠，因此，当您点击您认为是页脚链接的内容时，您实际上点击了推送元素。

你的包装器必须相对定位吗？

如果没有，您可以从包装类中删除 position: relative，然后就可以开始了：

Working example

【讨论】：

【解决方案3】：

那是因为 <ul class="nav"> 和 <ul class="nav2"> 已经覆盖，这意味着有东西在它们上面。您可以为具有链接和更高 z-index 的 ul 提供绝对位置以将它们堆叠起来，以便它们变得可点击。

Example

【讨论】：

【解决方案4】：

将z-index 添加到包装器

.wrapper {
    position:relative;
    width: 960px;
    height: auto !important;
    min-height: 100%;
    margin: 0 auto -80px;
    z-index:-1
}

DEMO

【讨论】：

【解决方案5】：

在 wrapper class div 的 CSS position 中是 relative。这是链接不可点击的主要原因，因此请将position:relative 添加到footer 类div。

【讨论】：

【解决方案6】：

你需要什么包装器？如果删除“位置：相对；”从包装类它可以工作。（或更改 z-index）

【讨论】：