我的下拉菜单是水平的。我需要它垂直

Question

请帮助我，我不能让我的下拉列表垂直。当我将鼠标悬停在列表上时，它是水平的。

我的HTML代码

<div id="header">
        <div>
            <a href="index.html" id="logo"><img src="logo.png" alt="LOGO" height="115" width="115px" /></a>

            <ul id="navigation">
                <li class="active">
                    <a href="index.html">Home</a>
                </li>
                <li>
                    <a href="what.html">What We Offer</a>
                </li>
                <li>
                    <a href="#">Solutions</a>
                    <ul>
                        <li>
                            <a href="inbound.html">Inbound</a>
                        </li>
                        <li>
                            <a href="outbound.html">Outbound</a>
                        </li>
                    </ul>
                </li>
                <li>
                    <a href="about.html">About</a>
                </li>
                <li>
                    <a href="contact.html">Contact Us</a>
                </li>
            </ul>
        </div>
    </div>

CSS

Answer 1

我看不到您的CSS，但您是否将$.ajax({ url: 'ajax_api/login_auth.php', type: 'POST', data: { "sEmail": sEmail, "sPassword": sPassword }, }) .fail(function() { console.log("jquery ajax login_auth error"); }).success(function(data) { console.log(data); }); 应用于顶级和子级菜单项？这将导致您描述的问题。

顶级display: inline项应为li，但其子项应为display: inline,。

请参阅此示例：https://jsfiddle.net/tLqrrfy0/