Javascript 当屏幕变小时，如何在图像中保留按钮

我想在图像中保留一个按钮。但当屏幕变小时，按钮离开图像区域，只是四处浮动。我怎样才能修好它

。滑块按钮{
背景：金；
边界半径：8px；
颜色：#262626；
边界：无；
填充：22px 72px；
文字装饰：无；
字体大小：16px；
位置：绝对位置；
左：25%；
底部：25%；
}
.滑块img{
位置：相对位置；
}

按W键以赢得

。滑块按钮{
背景：金；
边界半径：8px；
颜色：#262626；
边界：无；
填充：22px 72px；
文字装饰：无；
字体大小：16px；
位置：绝对位置；
保证金：自动；
左：0；
底部：0；
右：0；
排名：0；
}
img{
位置：相对位置；
}

按W键赢取

只需将按钮放在图像容器内：

<img src = "https://www.mundiario.com/media/mundiario/images/2019/10/02/2019100220032812226.png" class="slider-img"> 
<button class="slider-button">Press W to win</button>
</img>

按W键获胜

是否有您尚未包含的包装器div？你的HTML和CSS不匹配吗？按钮应该始终在图像的中间吗？如果没有，当改变屏幕大小时，它的位置会发生什么变化？图像不能有内容。