Html 导航栏的一小部分贴在页面上

在CSS中，我将状态栏的宽度设置为100%，但它仍然稍大一些。我的页面的其余部分都在右边被剪掉了，但是你可以向右滚动，看到我的状态栏被剪掉了。请帮忙！感谢您的帮助

CSS代码：

body{
    margin: 0px;
    background-color: lightgrey;
}

div.navigation{
    width: 99%;
    padding: 10px;
    height: 25px;
    background-color: black;
}

a.navigation{
    color: #f5f5f5;
    text-decoration: none;
    font-size: 20px;
    font-family: Century Gothic, sans-serif;
    display: inline-block;
    vertical-align: middle;
}
a.navigation:hover{
    color: grey;
}
a.navigation:active{
    color: darkred;
}
a.navigation:visited{
    color: #f5f5f5;
}

---

在CSS中，您在导航栏上设置了一些样式，这些样式正在添加填充。将第37行开始的代码更改为：

div.navigation {
  width:100%;
  padding: 10px 0;  /* Keeps the padding to the top and bottom only */
  height:25px;
  background-color: black;
}

---

填充导致浏览器将条的宽度解释为其容器宽度的100%加上填充的20px（左10px，右10px）

您可以使用CSS

框大小：边框框
div.navigation{
    width: 100%;
    padding: 10px;
    height: 45px;
    background-color: black;
    box-sizing: border-box;
}

注意：您需要将高度增加到45px，因为浏览器不会扩展顶部和底部填充框的高度

jsfiddle
 你能把CSS代码整理成你需要帮助的部分吗？我甚至不知道在没有HTML指导的情况下从哪里开始寻找。在我发布之后，你添加了一个链接。答案如下。您可以尝试将一个标记放在另一个“容器”标记内，如div或宽度为100%的其他标记，并按照您希望的方式在容器div内设置内容样式。请将HTML添加到问题中。本网站不仅为您提供特定问题的答案，也为未来读者提供帮助。如果/当你的网站发生变化或变暗时，这个问题对那些读者的帮助就会减少。如果我去掉了填充物，它会弄乱导航栏的其余部分：/好的，我试试看，谢谢！谢谢你的帮助，但那也没用：\我一辈子也得不到它！好的，如果你现在看一下，它是固定的，但是现在高度被抛了！我不得不把它改成“padding:10”，我想你的意思是
padding:10px0。您所建议的将顶部和底部设置为0px，但将左侧和右侧保持为10px@阿龙维加尔<代码>填充：10 10
实际上是
填充：0
。如果指定的值大于或小于0，则必须指定一个单位-例如
px
，否则浏览器会将该值解释为0。或者使用宽度计算修复填充（填充：10px 2%；宽度：96%）是-将填充调整为%值也会出错，尽管仅覆盖100%，但应为宽度：98%；填充：10px1%（1%左+1%右）。哦，我的错-没有看到你增加了宽度。在iPhone应用程序上查看！你当然是对的！