css - 填充使链接不起作用？

Question

该链接仅在我单击实际文本而不是它周围的区域时才有效，即使悬停效果有效，所以我知道该按钮已被定位？

这也发生在我使用左内边距并将图像放在那里的网站列表中，如果我单击内边距所在的位置，它不起作用？

.js 脚本会影响这个吗，这都是我正在使用的灯箱

有什么想法吗？？

ul#navigation { 
  list-style-type: none;
  margin: 0;
  padding: 0;
  padding: 0;
  }

ul#navigation li a {
  position: absolute;
  bottom: 10px; 
  display: block;
  width: 5em;
  padding: .5em 0;
  color: #FFF;
  background: #92da3a;
  text-align: center;
  text-decoration: none;
  font-size: 11px; 
  }

ul#navigation li a:hover {
  color: #05554f;
  }

ul#navigation .back {
  float: left;
  width: 4em;
  padding: 10px;
  }

ul#navigation .close {
  float: right;
  width: 4em;
  padding: 10px;
  }

ul#navigation li.mt {
  border-bottom: 2px solid #92da3a; 
  width: 480px; 
  position: absolute; bottom: 30px; left: 20px;
  }   

非常感谢:)

Answer 1

ul#navigation li a 的 CSS 没有任何问题。我已将您的 CSS 复制到 working example这似乎在 FF3、IE7 和 Chrome 中正常运行。

我不希望一段(写得很好的)JavaScript 以任何方式干扰您的链接。尽管一般来说，一段给定的未知 JavaScript 可以做任何事情。

影响最终渲染和行为的因素太多，无法确定可能的原因。您需要从最低限度开始，然后重新添加所有相关因素，直到它失效，或者直到一切都重新添加并正常工作。

• 从(验证)纯 (X)HTML 文档开始
• 添加相关的 CSS 以获得您想要的链接样式
• 添加 CSS 的其余部分，如果有其他 CSS 规则干扰，可能逐个添加
• 重新添加您的 JavaScript，在相关的地方再次逐个添加

完成此过程后，您应该更清楚地了解导致不良行为的因素。

我建议使用 FireFox 网络开发人员工具栏来检查哪些 CSS 规则应用于您的导航链接。您可能会发现其他一些松散指定的规则以意想不到的方式进行干扰。

您还应该确认您的标记和 CSS 是有效的 - 在处理无效输入时您无法准确确定正确的输出。