Html 右侧相对于视口的CSS相对位置

我有几个div，每个div都是前一个div的子div。它们都是相对定位的，这样我就可以相对于父对象偏移子对象。我想让右边的人排成一行，但我不知道怎么排。执行

width:100%

显然不起作用，因为它忽略了div不在

左侧：0

如您所见，div退出视口：

div{
位置：相对位置；
宽度：100%；
高度：250px；
左：50px；
顶部：50px；
}
#第一组{
背景色：#4286f4；
}
#第二组{
背景色：#3267bc；
}
#第三组{
背景色：#244a87；
}

< /代码> 您可以考虑使用<代码>余量而不是<代码>左边 > /p>
默认情况下，“宽度和高度属性包括内容，但不包括填充、边框或边距”（）

此外，块级元素占用“可用的全宽度”，因此不需要
width:100%
）


正文{
保证金：20px 60px 20px 20px；
}
div{
位置：相对位置；
}
div div{
高度：80px；
左边距：40px；
顶部：40px；
}
#第一组{
背景色：#4286f4；
}
#第二组{
背景色：#3267bc；
}
#第三组{
背景色：#244a87；
}

您可以分享所需输出的屏幕截图吗？您的每个div从左起为50像素，宽度为100%。。。它必须离开视窗50像素，不是吗？“每一个div都比上一个div高50px吗？”NitinDaddikar补充道，“不错，是的，但是怎么做呢？”？我不知道如何在CSS中获得相对于视口的当前左位置。这正是我想要的，谢谢！不确定这到底是为什么，但它确实。。。我们将不得不进一步考虑它，以了解它是如何工作的。另外，虽然我目前不需要这样做，但有没有办法增加右侧的差距？我只是想这可能会成为未来的一项要求。我补充了一些解释。你是说盒子和窗口右侧之间有间隙吗？你说得对，不需要
宽度：100%
。我的错误。在测试过程中，我从宽度：500px开始，但忘记了我可以将其移除，以使盒子尝试填充最大面积。是的，盒子和窗口右侧之间的间隙。根据上下文，我可能会将该空间添加到容器中。在我的示例中，这是
。我编辑了我的例子来反映这一点。哦，当然是真的！谢谢这是一个噩梦般的事情，试图谷歌，所以我很高兴你能够回答我的问题这么快后，我终于求助于问：D