HTML – 如何使全宽？

概述http://jsfiddle.net/bh2f6/1/ 我想这个< hr />所以它将拉伸整个宽度,直到其父容器的边缘.我已经尝试添加margin-left / padding-right来克服这个问题,但是在调整大小(响应)时它会不断变化. 有更好的解决方案吗？ 编辑：我无法编辑父容器的填充,因为它是一堆其他元素所需要的. 你的宽度：100％;在< hr />上并且父母的填充物搞砸了. < h http://jsfiddle.net/bh2f6/1/

我想这个< hr />所以它将拉伸整个宽度,直到其父容器的边缘.我已经尝试添加margin-left / padding-right来克服这个问题,但是在调整大小(响应)时它会不断变化.

有更好的解决方案吗？

编辑：我无法编辑父容器的填充,因为它是一堆其他元素所需要的.

解决方法 你的宽度：100％;在< hr />上并且父母的填充物搞砸了. < hr />自然地横跨屏幕延伸,不需要宽度：100％,所以将其移除.然后为了补偿填充,只需向< hr />添加相同的负边距.

将CSS更改为：

.single-article hr {    margin: 30px -20px 20px;    border: 0;    border-top: 1px solID #c9c7c7;}

See working jsFiddle demo

总结

以上是内存溢出为你收集整理的HTML – 如何使全宽？全部内容，希望文章能够帮你解决HTML – 如何使全宽？所遇到的程序开发问题。

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