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的默认填充，不需要时必须将其删除。只需将0px添加到ul，您将获得100％的div 尝试使用CSS Box模型来解决这种情况 https://www.youtube.com/watch?v=xF0dhepbzD8

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

1 个答案: