html - 使子元素在一个方向上比父元素宽

Question

我正在尝试居中的两列布局，我希望右列中的水平线一直延伸到浏览器视口(viewport)的右边缘。这将要求这些元素比它们所在的父列更宽，但仅在右侧。

这是一个示例图片:

_{(来源:sans-concept.com)}

这是 JSFiddle 上的一个快速模型，HR 已经到位但还没有扩展到容器之外:

http://jsfiddle.net/ericcarl/3fQKe/

这让我很接近:

hr {
   position: absolute;
   left: 0;
   right: 0;
}

但它将 HR 扩展到整个页面，而不仅仅是右侧。对此有什么想法吗？谢谢!

Answer 1

如果你确保你的整个创作都在一个屏幕大小的 div 中，并且有属性溢出:隐藏；那么你可以让它们无限长，最终用户应该无法分辨。

有点像宽度:500%；应该可以解决问题。

http://jsfiddle.net/hx2YF/

这是一个 fiddle 。拖动结果窗口，使其足够大以查看结果。