调整窗口大小时图像移动

Question

我已经尝试过几次，以使我的网站上的图像在调整窗口大小时不会移动-不走运。

我“简单地”希望此图像无论窗口大小如何都完全位于同一位置。

我想在顶部显示“ kranz”的图片，并在“本周的英雄”上添加文字。 如您所见，文本停留在同一位置。

如果您有任何建议或解决方案，我将很高兴听到它们！

jsfiddle.net/VDfN4

谢谢！

Answer 1

目前的代码和您要完成的任务很难说清楚，但是从我的角度看，问题可能出在#kranz img的绝对位置上。 尝试使用position：relative或将kranz div包裹在position：relative的另一个div中。

Answer 2

不要使用百分比放置。

#kranz img {
 position:absolute;
left:42%;
margin-left:-50px;
margin-top:-13%;
width:275px;
}

左边：42％是容器宽度（或窗口宽度）的42％，上边距是容器高度（或窗口高度）的13％....因此，如果窗口调整大小并且容器调整测量值的大小更改。 使用像素或其他绝对测量值，而不要使用相对测量值（例如百分比）。