Html 一<；部门>；比其他的宽

所以在一个网站上，我制作了一个导航栏，我用这个代码

    <div id="container">
        <a href="index.html"><span>Home</span></a>
        <a href="blackmail.html"><span>Blackmail</span></a>
        <a href="keep_safe.html"><span style="color: #7CFC00">Keeping Safe</span></a>
        <a href="bully.html"><span>Cyberbullying</span></a> 
            <a href="about.html"><span>About</span></a>
    </div>

但是，此导航栏比其他导航栏宽，代码完全相同（除了颜色，颜色显示您所在的页面） 如果有人告诉我为什么会发生这种情况，或者如何修复，我将不胜感激

网站-nibble90.github.io

带有较宽导航栏的页面是“保持安全”页面

用这个代码替换

#容器

代码，它就会工作。对于容器宽度，最好使用

%

或

px

而不是

em

#container {
    display: block;
    width: 25em;
    margin: 0 auto;
    padding: 10px 0px;
    margin-top: 2em;
    text-align: center;
    background-color: #333;
    width: 100%;
}

用此代码替换

#容器

代码，它将正常工作。对于容器宽度，最好使用

%

或

px

而不是

em

#container {
    display: block;
    width: 25em;
    margin: 0 auto;
    padding: 10px 0px;
    margin-top: 2em;
    text-align: center;
    background-color: #333;
    width: 100%;
}

您的#容器菜单具有固定宽度（83em）和填充。当您的内容长度超过页面高度时，会出现一个垂直滚动条，您的固定宽度元素无法调整以适应它

您应该将其宽度设置为100%，最小宽度为550px，大小为边框框。这意味着它在不同大小的浏览器上更适合您的页面，并且可以自动调整垂直滚动条的存在与否

因此：

您的#容器菜单具有固定宽度（83em）和填充。当您的内容长度超过页面高度时，会出现一个垂直滚动条，您的固定宽度元素无法调整以适应它

您应该将其宽度设置为100%，最小宽度为550px，大小为边框框。这意味着它在不同大小的浏览器上更适合您的页面，并且可以自动调整垂直滚动条的存在与否

因此：

---

CSS中的宽度是让你感到不舒服的地方。移除宽度，div的大小将匹配

#container {
display: block;
margin: 0 auto;
padding: 10px 0px;
margin-top: 2em;
text-align: center;
background-color: #333;
}

---

确保删除这两个，因为其中有两个宽度。

CSS中的宽度会让你感到不舒服。移除宽度，div的大小将匹配

#container {
display: block;
margin: 0 auto;
padding: 10px 0px;
margin-top: 2em;
text-align: center;
background-color: #333;
}

---

确保删除这两个选项，因为其中有两个宽度。

能否设置一个显示问题的代码段？原因：没有什么看起来不对劲。你能发布与这个问题相关的CSS吗？或者你能在一个网页上重现这个问题吗？我在那个网页上只看到一个导航栏。我制作了一个JSFIDLE，它并没有真正做到公正，但这里有一个链接。是的，这里只假设有一个导航栏，但它比我网站上的其他导航栏长。如果可能的话，如果它与顶部的横幅一样大，那就太酷了！您可以设置一个代码段来显示您的问题吗？原因：没有什么看起来不对劲。你能发布与这个问题相关的CSS吗？或者你能在一个网页上重现这个问题吗？我在那个网页上只看到一个导航栏。我制作了一个JSFIDLE，它并没有真正做到公正，但这里有一个链接。是的，这里只假设有一个导航栏，但它比我网站上的其他导航栏长。如果可能的话，如果它与顶部的横幅一样大，那就太酷了！