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

概述我正在尝试一个居中的两列布局,我希望右列中的水平规则一直延伸到浏览器视口的右边缘.这将要求这些元素比它们包含的父列更宽,但仅在右侧. 这是一个示例图像： Example http://sans-concept.com/temp/layout.jpg 这里是JSFiddle的一个快速模型,HR已经到位但尚未扩展到容器之外： http://jsfiddle.net/ericcarl/3fQKe/ 这让 我正在尝试一个居中的两列布局,我希望右列中的水平规则一直延伸到浏览器视口的右边缘.这将要求这些元素比它们包含的父列更宽,但仅在右侧.

这是一个示例图像：

Example http://sans-concept.com/temp/layout.jpg

这里是Jsfiddle的一个快速模型,HR已经到位但尚未扩展到容器之外：

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

这让我很接近：

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

但它将HR扩展到整个页面,而不仅仅是右侧.有什么想法吗？谢谢！

解决方法 如果你确保你的整个创作都在一个带有属性的屏幕大小的div中
溢出：隐藏;
然后你可以让它们无限长,而最终用户应该无法分辨.

就像是
宽度：500％;
应该做的伎俩.

http://jsfiddle.net/hx2YF/

这是一个小提琴.拖动结果窗口使其足够大以查看结果.

总结

以上是内存溢出为你收集整理的html – 在一个方向上使子元素比父元素宽全部内容，希望文章能够帮你解决html – 在一个方向上使子元素比父元素宽所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。