css - 无法在响应式菜单中将边距设置为零

Question

我尝试为我的网站制作一个响应式标题，一切正常，但我无法将链接的边距设置为 0。您可以在图片中看到:https://imgur.com/s5EzL6n

我想要实现的是将所有灰色背景设为 100% 宽度。

我关注了这个 youtube 视频:https://www.youtube.com/watch?v=lYw-FE60Dws

我敢肯定，我可能设置了一些错误，但我是初学者。

HTML:

<header>
    <div class="container">
        <div id="branding">
            <a href="index.html"><img src="logo.png"></a>
            <a class="toggle">Meniu</a>
        </div>
        <nav>
            <ul class="active">
                <li class="current"><a href="index.html">Acasă</a></li>
                <li><a href="despre.html">Despre</a></li>
                <li><a href="servicii.html">Servicii</a></li>
                <li><a href="proiecte.html">Proiecte</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </nav>

    </div>
</header>

CSS:

    /* responsive header*/

.toggle{
    display: none;
    position: absolute;
    right: 10px;
    top: 26px;
    padding: 5px;
    cursor: pointer;
    text-decoration: none;
}

@media (max-width: 940px){

    .toggle{
        display: block;
    }

    header .toggle{
        padding: 0 0;
        font-size: 18px;
    }

    header ul li{
        display: block;
        width: 100%;
        background-color: grey;
    }

    header ul.active{
        display: block;
    }

    header ul li a{
        display: block;
        text-align: center;
    }

    header nav{
        margin: 0;
        width: 100%;
    }

    header ul li{
        width: 100%;
    }

}

/*normal page*/
header a{
    color: #fcfcfc;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 16px;
    padding-right: 25px;
}


header li{
    float: left;
    display: inline;
    padding: 0 20px 0px 20px;
}

header #branding{
    float: left;
    height: 90px;
    margin-left: 35px;
}  

header a{
color: #fcfcfc;
text-decoration: none;
text-transform: uppercase;
font-size: 16px;
padding-right: 25px;
}

Answer 1

ul有一个默认的padding，不需要的时候要去掉。只需将 0px 添加到 ul，您将拥有 100% 的 div 尝试使用 css 盒模型来解决此类情况 https://www.youtube.com/watch?v=xF0dhepbzD8