Responsive design 响应性设计和位置：绝对

有没有建议你如何使用position:absolute和responsive设计

我有一个1000px宽的设计，在容器div（1000px）的左边有一个图像，定位为position:absolute

问题是，当我减小浏览器的宽度时，会出现水平滚动

采用响应式设计定位绝对div的正确方法是什么

---

编辑：这是我正在谈论的一个例子。例如，我将容器宽度设置为100px，而不是1000px

关键是，当我因为图片中的“绝对”元素而减小浏览器的宽度时，我得到了水平滚动条。我怎样才能以正确的方式做它，我不会得到水平滚动条

<div class="bggrey">

    <div class="absolute-left"><img src="http://placehold.it/200x200" /></div>
    <div class="row">content</div>

</div>

.bggrey{
    width: 100%;
 background: #999;   
    height:500px;
}

.row{
 width:100px;   
    height:500px;
    background: #fff;
    margin: auto;
}

.absolute-left{
    position:absolute;
    left:50%;
    margin-left:-300px;
    width:200px;
    height:100px;
}

内容
格蕾先生{
宽度：100%；
背景：#999；
高度：500px；
}
.行{
宽度：100px；
高度：500px；
背景：#fff；
保证金：自动；
}
.绝对左{
位置：绝对位置；
左：50%；
左边距：-300px；
宽度：200px；
高度：100px；
}

我通过为背景制作另一个div并将图像作为背景图像来实现这一点。使用zurb基金会获得响应性图像也有帮助。

您的问题很难理解，请澄清。视觉辅助是一个好主意（我喜欢将需要共享的图像存储在imgur.com上）。您可能需要向我们展示一个您正在使用的示例，以便我们能够回答这个问题。指向有问题的站点的链接，或者指向codepen.io或jsfiddle的链接通常最有帮助。编辑：这是我正在谈论的一个示例。例如，我将容器宽度设置为100px，而不是1000px。关键是，当我因为图片中的“绝对”元素而减小浏览器的宽度时，我得到了水平滚动条。我怎样才能以正确的方式做它，我不会得到水平滚动条？