Question

如何在左侧标题中浮动导航列表而不在列表左侧创建间隙？请告诉我我必须更改或添加什么才能实现无差距？在我的屏幕上，间隙很明显，大约1厘米宽，在右侧导航菜单/列表中，没有间隙。请告诉我如何使我的左侧菜单像我的右侧菜单一样浮动。

<!DOCTYPE html>
<html>
    <head>
        <style>
            header {text-align:center;}
            nav#right_menu > ul > li{display: block;float:right;position:relative; width:25px;}
            nav#left_menu > ul > li{display: block;float:left;position:relative; width:25px;padding: 0px;margin:0px; border:0px; text-align:left;}
        </style>
    </head>
    <body>
        <header>
            <nav id="left_menu">
                <ul id="left_menu">
                    <li>Hi1</li>
                    <li>Hi</li>
                </ul>
            </nav>
            <nav id="right_menu">
                <ul>
                    <li>Hi1</li>
                    <li>Hi</li>
                </ul>
            </nav>
            <img id="logo" src="logo.png" alt="logo" />
        </header>
    </body>
</html>

markt用ul {padding：0;}回答了这个问题，我为解决这个问题而添加的代码是：nav＃left_menu＆gt; ul {padding：0;} 编辑：如果浮动时双方都存在这个间隙问题，我会使用markt的确切代码;但是，我只有左侧菜单的问题，因此我使用了我的代码，即使markt的代码也有效。

Answer 1

在ul

上填充

尝试添加：

ul { padding: 0; }

到你的css

浮动在标题中，导航列表和浏览器边缘之间没有间隙

1 个答案: