[英]Why does my website menu move around in Internet Explorer only?
我编写了一个顶部固定菜单的网站,但是在Internet Explorer 11中,当我单击菜单中的按钮时,它会移动约半秒钟或类似的时间。 在其他浏览器中,它可以正常工作。 我可以更改些什么来消除该错误,我认为这与我的CSS代码有关。
这是指向我的网站的链接,使用IE进行查看,然后单击顶部的按钮以查看问题所在:) http://www.ivan.ilic.hg-gf.de/index.html
如果有人可以帮助我,那将是非常好的。 我希望按钮在IE和Mozilla,Chrome中都相同。 我认为IE总是与其他浏览器有所不同。
这是我的“导航”菜单的CSS代码:
/* CSS Menu Navigation Bar */
#cssmenu
{
position: relative;
margin: 0 auto;
clear: both;
}
#cssmenu a
{
list-style: none;
margin: 0;
padding: 0;
border: 0;
line-height: 1.5;
}
#cssmenu li
{
border: 1px solid transparent;
padding-top: 7px;
display: block;
float: right;
margin: 0 10px;
}
#cssmenu ul
{
margin: 0 auto;
padding: 0;
text-align: center;
padding-right: 20px;
margin-bottom: -70px;
max-height: 80px;
}
#cssmenu li a
{
padding-top: 10px;
padding-right: 20px;
padding-left: 20px;
padding-bottom: 10px;
width: 70px;
border: 1px solid #dfdfdf;
text-decoration: none;
display: block;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
font-size: 17px;
font-family: Verdana, Tahoma;
color: #292F33;
}
#cssmenu li:hover a
{
border-bottom: 3px solid #30B0FF;
display: block;
color: #30B0FF;
clear: both;
font-size: 17px;
font-family: Verdana, Tahoma;
transition-duration: 0.05s;
transition-delay: 0.03s;
}
/* screen smaller than 1325px */
@media only screen and (max-width : 1325px),
only screen and (max-device-width : 1325px)
{
#menu
{
min-width: 1020px;
}
#cssmenu li a
{
padding-top: 10px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 10px;
width: 60px;
font-size: 15px;
border: 1px solid transparent;
}
#cssmenu li:hover a
{
font-size: 15px;
}
}
这是重要的HTML代码:
<!-- Menu -->
<div id="menu">
<li style="list-style: none;"> <img id="image" src="images/head.png"/><br><i> {by Ivan Ilic}</i></li>
<div id='cssmenu'>
<ul>
<li><a href='lazarus.html'>Lazarus</a></li>
<li><a href='scratch.html'>Scratch</a></li>
<li><a href='html.html'>HTML</a></li>
<li><a href='c-sharp.html'>C#</a></li>
<li><a href='c++.html'>C++</a></li>
<li><a href='index.html'>Home</a></li>
</ul>
</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.