html - 背景颜色在 100% 处停止，但在屏幕必须向右滚动时停止。任何想法如何解决

Question

这是一个更笼统的问题；但我注意到一些网站（包括stackoverflow）当内容离开屏幕并且用户必须滚动到正确的背景图像/颜色停止在屏幕视图的100％时。有没有人知道如何解决这个问题......除了设置最大和最小宽度？

这是两个不同网站的谷歌文档来解释我在说什么。

https://docs.google.com/document/d/133Uek4Fd3G3eB6Zz4CNomPGzARevCUg4fAV4Xhvin-o/edit?usp=sharing

Answer 1

Josh C's response is spot on. If the elements that have background colours had min-widths that matched the content width (980px in stackoverflow's case) then the issue would be resolved. This is not only the easiest way, but probably the best practice)

Your alternative, if you don't want to set max and min values to your elements that use percentages, would be to not set fixed widths on elements (in the case of stack overflow, it's content width is fixed at 980px, and most everything else is fluid).

If content and it's children used max-width instead of width this problem would disappear.

Alternately, as lookingGlass points out, more fluid responsiveness. Add breakpoints so that when your window size is below/above your ideal the site adapts.