Microsoft Edge状态栏是阻止按钮

Question

Edge浏览器的状态栏阻止了我正在处理的Web应用程序左下角的按钮。 Chrome不会显示状态栏，因为按钮不是链接（如果是链接，状态栏会偏离右侧）。

首先，我认为微软应该对此采取一些措施，但目前是否有编程解决方案？

边缘浏览器

铬

**编辑：我可以将按钮更改为与href="#"和onclick动作的链接：这不会显示状态栏，但我想没有任何CSS解决方案，所以我不必更改100页的标记（这是一个非常大的应用程序，屏幕有不同的按钮）...

Answer 1

这是Microsoft Edge的已知问题。我们的团队已调查此事，并将在未来的版本中解决此问题。我将在该版本发布时更新此答案。

目前，您可能会发现对UI的微妙调整可以完全避免这个问题。例如，您可以定义一个区域，当输入该区域时，该按钮会使按钮在已知的工具提示区域上方提升：

在上面的例子中，我定义了一个包含链接的区域：

<div class="footer-links">
    <a href="/informatie">Informatie</a> 
    <a href="/wijzigen">Wijzigen</a>
    <a href="/verwijderen">Verwijderen</a>
</div>

然后我添加了一些填充以在.footer-links的顶部和各个<a>元素之间创建空间：

.footer-links {
    padding: 3em 1em 1em 1em;
}

最后，当容器悬停时，我将元素转换为：

.footer-links a {
    display: inline-block;
    transition: transform .75s;
}

.footer-links:hover a {
    transform: translateY(-2em);
}

您可以使用边距或其他方法完成变换（如果您愿意）。我添加的另一个微妙的效果是延迟第二和第三个元素的转换：

.footer-links a:nth-child(2) {
    transition-delay: .25s;
}

.footer-links a:nth-child(3) {
    transition-delay: .50s;
}

我希望这有帮助。

Answer 2

我也有这个问题，日期是2019年4月。显然，微软的解决方案是转发Edge，转而使用基于Chrome的浏览器。我喜欢Edge。无论如何，重新定位div的提议解决方案是荒谬的。如果您的按钮位于页面底部，则只需在包含div的底部添加填充，以使内容高于页面的绝对底部：

.divContainer {padding：0px 0px 24px 0px; }

这对我有用。基本上，我们将页面底部向下移动24个像素。