Html 带溢出隐藏父对象的绝对定位图像

我有一个父div

.outer

，我用它作为“窗口”，下面有一个图像和一个热点。父div是设备的宽度，最大为960px

在我的示例中，对于mobile（360px宽度），我将自行车运动员的前轮显示在窗口的中心，但当我展开窗口时，图像慢慢向左移动，将车轮推到看不见的地方

.container{
最大宽度：960像素；
最小宽度：320px；
保证金：0自动；
}
.外部{
边框：20px纯蓝；
溢出：隐藏；
位置：相对位置；
}
.img{
左-26%；
位置：相对位置；
排名：0；
}

对我来说，你需要的不仅仅是css。我的意思是你需要一个Javascript来执行它。如果你把自行车的前轮放在中间，你会在足够宽的屏幕上看到它左边的空白吗？另外，热点作为这个问题的一部分有什么作用吗？@AndrewMessier-我打算用一个媒体查询来改变左边的-26px，当它有一个平板电脑/桌面时，这样就不会出现空白。热点并不是问题的一部分，所以我将删除它。对我来说，你需要的不仅仅是css。我的意思是你需要一个Javascript来执行它。如果你把自行车的前轮放在中间，你会在足够宽的屏幕上看到它左边的空白吗？另外，热点作为这个问题的一部分有什么作用吗？@AndrewMessier-我打算用一个媒体查询来改变左边的-26px，当它有一个平板电脑/桌面时，这样就不会出现空白。热点不是问题的一部分，因此我将删除它。