html - 无法选择(单击) float Div 中的 anchor 链接

标签 html css css-float anchor

我从来没有见过这样愚蠢的事情,或者可能是凌晨 2:30 而我出现了幻觉。我在标题中制作了简单的 anchor 链接,但我完全无法点击它们。它们只是纯文本,完全不可点击。

如果你能给我一个提示,说明我在什么地方/哪里没有遵守 HTML/CSS 守护进程,我将不胜感激。

HTML

<header>
    <div class="confine">

        <div class="complete-head-content">

              <div class="left-width-less logo-width">
                  <img src="./imgs/twit-logo.png" />
              </div>

              <div class="right-width-less">
                  <div class="top-header-content">

                         <h1 class="pres-title">Defining Twisted Strategy</h1>
                  </div>

                  <div class="lower-header-content">

                        <div id="navcontainer">
                          <ul>
                            <li><a href="http://www.google.com">Meet the Hobos</a></li>
                            <li><a href="#">Why me?</a></li>
                            <li><a href="#">Our Work in Oblivion</a></li>
                            <li><a href="#">Our Perspective</a></li>
                            <li><a href="#">Our Approach</a></li>
                          </ul>
                        </div>

                  </div>
              </div>

              <div class="c"> </div>
        </div>

    </div>

  </header>

  <div id="contend"> 
  ... ... ... 

CSS

a {
  color: #EA2E49;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  color: #EA2E49;
  cursor: pointer;
}

header {
  height: 50px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: block;
  z-index: 1;
}

.complete-head-content {
  width: 100%;
  background-color: #a0c654;
  height: 130px;
}

.left-width-less {
  float: left;
  background-color: #fff;
  width: 15%;
  text-align: center;
  height: 130px;
    vertical-align: middle;
}

.left-width-less img {

  width : 76px; 
  height: 100px;
  margin-top: 10px;
}

.right-width-less {
    float: right;
    width: 85%;
}

.top-header-content {
  width: 100%;
  height: 70px;
  background: #437b3c url("../imgs/presentation-title-bg.jpg") no-repeat right;
}

.lower-header-content {
  width: 100%;
  height: 70px;
}

.logo {
  cursor: pointer;
}

/* Navigation */

#navcontainer {
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  text-transform: uppercase;
  margin-top: 19px;
}
#navcontainer ul
{
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: left;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a
{
  text-decoration: none;
  padding: .2em 1.7em;
  color: #fff;
}

#navcontainer ul li a:hover
{
color: #fff;
background-color: #369;
}

编辑

感谢 Nikhil,它有一个 Z-index:1,删除后修复了错误。

谢谢。

最佳答案

除非你遗漏了什么。无论有没有CSS,它都对我有用。 在 IE 8 中测试

顺便说一句,您是如何包含 CSS 的?

关于html - 无法选择(单击) float Div 中的 anchor 链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18865354/

相关文章:

javascript - 获取在 hidden/shown.bs.collapse 上折叠的元素

css - 如何将元素 float 到高于其前一个兄弟的位置?

css - 元素宽度随着高度的增加而扩展

css - 使用 float 将文章和侧边栏放在一起

javascript - 提交点击后重置输入

html - 在 HTML 页面上从一个 div 到另一个 div 画线

python - 使用python填写网站文本框,点击按钮下载

html - 加载延迟动画,不显示

html - 调用类时不显示 div 背景色

css - JavaFX:CSS 变量