Question

我感到很困惑。我已经制作了一个HTML页面，它使用CSS动画和一些非常基本的Javascript。虽然我确定我没有做到最好/最有效的方式（对此仍然有点新），但它足以让我对它感到满意，但是在Chrome，Safari或Opera中运行时我遇到了一些关于如何渲染元素的间歇性问题。

导航到＆＃34;问题解决技能＆＃34;，然后从那里导航到＆＃34;沟通技巧＆＃34;或者＆＃34;领导技能＆＃34;。位于底部问题解决技能的导航按钮仍然可见。但他们并不是真的在那里......如果我按下Ctrl + A他们会消失。你无法点击它们，它们只是离开那里。

我已经在几台电脑上试过这个并遇到了同样的问题。有时它根本不会发生。它似乎不会发生在IE或Firefox上。这可能与这些浏览器如何渲染元素以及它们如何处理不透明度有关吗？

非常感谢提前。

编辑：这是一个屏幕抓取：http://i.stack.imgur.com/FPtGQ.png

Answer 1

这是一个很长的镜头，但你在这些按钮上的HTML格式不正确，尝试修复它并看看会发生什么：

<p class="btnText">Communication skills</p class="btnText">

应该是：

<p class="btnText">Communication skills</p>

修改

好的，请尝试将此样式添加到.example2：

height: 100%;

并将溢出更改为：

overflow:hidden;