html - Firefox 不打开 HTML 链接,Chrome 和 Edge 工作

标签 html css google-chrome firefox mozilla

我的网站遇到了一个以前从未见过的问题。我有一个指向网站其他页面的“a”链接,它们在 Edge、Chrome 和 Safari 中运行良好,但 Firefox 无法打开它们。我只是轻按一下,什么也没发生。

问题的我的导航 CSS:

.navigation {
width: 75%;
position: relative;
left: 13em;
top: 3em;
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
}

.dropbtn {
background-color: transparent;
color: white;
font-size: 34px;
font-family: 'Anton', sans-serif;
border: none;
cursor: pointer;
}

.dropbtn:hover, .dropbtn:focus {
background-color: #680b1e;
}

#about {
position: relative;
display: inline-block;
float: left;
margin-left: 40px;
}

HTML

<div id="about">
<button class="dropbtn"> <a href="about.html"> Book </a> </button>    
</div>

最佳答案

问题是 HTML,a 不允许在 button 内部,有关详细信息,请参阅此问题:

Link inside a button not working in firefox

一个可能的解决方法是使用按钮上的 click 事件来更改 window.location(使用 javascript),但不推荐这样做,再次检查问题我已链接以获取有关解决方法和修复的更多详细信息。

关于html - Firefox 不打开 HTML 链接,Chrome 和 Edge 工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46460927/

相关文章:

php - 用于传递 PHP 变量的 Javascript 语法

javascript - 文档元素后的垃圾。如何避免在 vanilla javascript 中使用 ajax get (XMLHttpRequest) 进行 XML 解析?

jquery - 更改 Bootstrap 下拉插入符号

css - 固定位置在 Safari 7 中不起作用

css - 了解 css 背景速记属性

google-chrome - Chrome 中的 WebGL 性能问题

javascript - 当我的网页在后台时,如何防止计时器被 Chrome 限制?

javascript - 如何制作选项选择更改按钮链接?

css - 垂直边距不会在 Chrome 中折叠

php - Laravel - htmlentities() 期望参数 1 为字符串,给定数组