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

Question

如何将 header 中的导航列表向左浮动而不在列表左侧创建间隙？请告诉我我必须更改或添加什么才能达到没有差距的效果？在我的屏幕上，缝隙很明显，大约1cm宽，而在右侧导航menu/list上，没有缝隙。请告诉我如何使我的左侧菜单像我的右侧菜单一样浮动。

<!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 > ul {padding:0;} 编辑：如果我在浮动时两边都有这个间隙问题，我会使用markt的确切代码；但是，我只有左侧菜单有问题，因此我使用了我的代码，即使 markt 的代码也可以工作。

Answer 1

在ul上填充

尝试添加：

ul { padding: 0; }

给你的css

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

Floating in a header without a gap between the navigation list and the edge of the browser

css

floating