Question

菜单从左到右跳转，然后在我浏览导航时再次返回。如果我在链接1中单击链接2，则导航（不是页面）跳转，当我单击链接3时，同样的事情。

我无法调整或发布代码，因为它只有4页。

为什么会这样做以及如何解决？

编辑：

HTML

<div id="nav">
    <ul> 
        <li><a href="../index.html">> om oss</a></li>
        <li><a href="vad.html">> vad vi gör</a></li>
        <li><a href="retorik.html">> vad är retorik?</a>
            <ul>
                <li><a href="teknik.html">Presentationsteknik</a></li>
                <li><a href="page/retotikkrea.html">Retorik & kreativitet</a></li>
                <li><a href="chefledare.html">Chef eller ledare?</a></li>
                <li><a href="grunder.html">Retorikens grunder</a></li>
                <li><a href="memoria.html">Memoria</a></li>
                <li><a href="foretagsretorik.html">Företagsretorik</a></li>
                <li><a href="hallatal.html">Hålla tal</a></li>
            </ul>
        </li>
        <li><a href="sidor/weekend.html">> storytelling</a></li>
        <li><a href="sidor/fq.html">> kontakt</a></li>
    </ul>
</div>

CSS

#nav {
    background-color: #8D8084;
}

#nav ul {
    margin:0;
    list-style-type: none;
    padding: 12px;
}

#nav li {
    display:inline;
    position:relative;
}

#nav ul ul li
{
 display:block;
}


#nav ul li a {
    text-decoration:none;
    color:#fff;
    padding-right: 60px;
    padding-top: 15px;
    padding-bottom: 13px;
    padding-left: 50px;
    margin: -12px;
    background:#8D8084;
    font-family: Candara,"Trebuchet MS", Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    text-transform:uppercase;
}

#nav ul ul li a
{    
    width:170px;
    display:block;
    margin: 0;
    padding-right: 10px;
    padding-top: 15px;
    padding-bottom: 13px;
    padding-left: 20px;
}

#nav ul li.active  a {
    background-color:#A4999D;
    color:#FFFFFF;
}

#nav a:hover {
    background-color:#A4999D;
    color:#FFF;
}

#nav ul ul {
    display: none;
    position:absolute;
    top:18px;
    left:-24px;
}

#nav ul li:hover > ul {
    display: block;
}

Answer 1

我认为是因为你的父div没有固定的宽度和高度：

#nav {
    background-color: #8D8084;
    width: 100%;
    height: 30px;
}

当我点击导航中的其他链接时，为什么我的菜单会跳转？

1 个答案: