为了说明我的问题，看看下面的小提琴：http: //jsfiddle.net/ECaD6/
假设我制作了这个网页，其中中心（深灰色）区域是页面的主要内容。此内容区域的背景特意采用不同于不包含任何内容的容器侧面的颜色。
我已经绝对放置了一个图像，因此它位于预期内容区域的范围之外。这在桌面浏览器上有效并且看起来不错。
但是，当在移动浏览器中查看时，用户可以缩小页面以便他们看到：
如果浏览器只能缩小与内容容器一样宽，我会喜欢它。这可能吗？我显然可以在上面放一个overflow-x:hidden，div但它实际上会完全切断足球。
如果移动浏览器只能缩小到这么远，那就太好了：
我知道从技术上讲，图像（在这种情况下）是“内容”的一部分，因为它位于内容 div 中。我想知道是否有任何布局或 css 技巧可以用来实现我正在寻找的东西。