Html “的DIV宽度”；“100%”；滚动页面右端

我有一个非常简单的布局，有两个div：一个固定宽度的左栏和一个右栏，应该占据剩余宽度的100%。两者都是100%高度，如果高度高于窗口高度，我希望右边的项目有一个垂直滚动条

我当前的代码占据了整个浏览器窗口，但右侧区域会从浏览器的可视区域向右滚动，并且永远看不到垂直滚动条

HTML:

---

当你给某个东西

宽度：100%

时，它意味着“无论我的容器有多宽，我都会有相同的宽度”——它并不意味着“我将占据100%的可用空间”

换句话说，假设父DIV的宽度为300像素——如果您给子DIV的宽度为100%，那么它将是300像素的100%

因为左列的宽度是固定的，所以这里可以做的是在右div中添加一个左边距

div.left
{
     width: 249px;
}

div.right
{
     width: 100%;
     margin-left: 249px;
}

---

与其让更宽的区域填充空间，为什么不让左栏绝对定位，让主要内容填充整个页面，用左键填充内容？

一个100%宽度的div将填充它所在的容器。您的容器是页面宽度的100%。它没有考虑到你用绝对定位将它向右移动250像素的事实

您的最佳选择：

---

.希德斯基普林克应该紧随其后.主要在流程中。向左浮动.hideskiplink，给它一个宽度，然后给.main一个与.hideskiplink宽度相匹配的

左边距。
有时需要将CSS中正文中的边距设置为0

例如

因为默认情况下，一些浏览器在左侧有两个像素填充
 我已经解决了这个问题，将“body”的最小宽度设置为与该分区中我的内容宽度相同的值。
还值得注意的是，宽度表示内容宽度。它从这个开始，然后添加填充、边框和边距。因此，即使页面上有一个100%的div，如果有任何填充，它仍然会从屏幕上滚动出去。@gtd是100%正确的。但是，您可以使用CSS的
框大小：border-box规则。不过，我有它大部分工作，感谢你的评论！我仍然希望我能接触到一位DIV禅师，让我走下去……有时候行为会很奇怪！
div.hideSkiplink
{
    padding:20px;
    background-color:#990000;
    position:fixed;
    top:0px;
    left:0px;
    width:249px;
    height:100%;
}
div.main
{
    padding: 10px;
    margin: 0px;
    background-color: #000000;
    color: #ffffff;
    position: fixed;
    top: 0px;
    left: 250px;
    width: 100%;
    height: 100%;
}

div.left
{
     width: 249px;
}

div.right
{
     width: 100%;
     margin-left: 249px;
}

body {background-color:#000; margin-left:0px;}