Css 将div从边栏定位到窗口的右边框

我无法按我的意愿定位一个div。 这是我想要的布局模式

[已编辑]

红色部分是造成问题的部分。我希望它从左侧边栏转到窗口的右边框

我该怎么办？

一些代码：

制作一个固定宽度的容器。里面是一个固定宽度的条，浮动：左。接下来，也是在内部，一个向右浮动的content

div

，以及一个内部带有fill content

div

宽度的标题

我猜您的左栏（菜单栏？）的宽度是固定的，下面是一个工作示例：

#标题{
宽度：100%；
高度：40px；
背景：蓝色；
}
#内容{
高度：300px；
宽度：100%；
}
#左U形杆{
浮动：左；
左边距：20px；
宽度：100px；
身高：100%；
背景：绿色；
}
#右边的酒吧{
左边距：120像素；
身高：100%；
背景：黄色；
}
#标题(右){
宽度：100%；
高度：30px；
背景：红色；
}

---

绝对定位使任何事情都成为可能

通过修改最后一个属性，可以指定浏览器窗口左侧和侧边栏之间所需的空白量：

#侧栏，
#红色的{
左：20px；/*将其更改为任意值，如果不需要，则更改为0*/
}​

我决定做一个新的答案，而不是编辑，因为这是一个完全不同的方法：

关键要素：

• 有一个虚拟元素（

  #dummy

  ），它将菜单栏的背景色扩展到浏览器窗口的右侧，纯粹用于装饰目的

• #侧栏

  的位置绝对正确，可以延伸到浏览器窗口的底部

• #侧边栏

  、

  #内容

  和

  #菜单

  位于#容器内，该容器具有固定的宽度并应用了

  边距：0自动

  ，因此它在浏览器内始终居中

---

提供迄今为止您已生成的代码。我们不会从头开始为您编码。这里有一个开始代码：无法定位菜单div…谢谢，但问题是我不希望红色部分的宽度固定。不管窗口大小，它都应该位于窗口的右边框。你也可以用百分比定义栏、容器和标题的宽度，这也行。我不明白你的意思。如果将容器定义为80%的宽度、20%的栏以及60%的内容和标题，那么无论屏幕大小如何，它都应该可以工作。你的主体应用了400px的宽度。那么，当你有

div\content

时，你不应该将主体标记称为“content”，这是对语言的滥用。答案更新，以避免任何误解你接近我的意思，除了我不能绝对定位边栏。这里有一个改进的模式：@hugo为什么不能绝对定位它？它包含在另一个div中，必须居中（边距：auto）。这里有一个开始代码：@hugo你可能会惊讶地发现，以这种方式进行绝对定位和居中都是可能的。请允许我重新编辑我的答案。我真的不知道怎么可能。如果你能在你的JSFIDLE上给我看，那就太好了：-）非常感谢！太好了！非常感谢：-）