圖片在調整窗口大小時移動

Question

我嘗試了好幾次，在我的網站上調整窗口大小時不會移動圖片 - 沒有運氣。

我「簡單地」希望這個圖像保持在同一個地方，不管窗口大小。

這是我想要在頂部的圖像「克蘭茲」，在文本「本週的英雄」。正如你所看到的，文本保持在同一個位置。

如果您有任何建議或解決方案，我會很高興聽到他們！

jsfiddle.net/VDfN4

謝謝！

Answer 1

很難說現在的代碼和你想要完成什麼，但從我能看到的問題可能是因爲#kranz img的絕對定位。嘗試使用position：relative或將kranz div包裝在另一個div中，該div是position：relative。

Answer 2

請勿使用展示位置百分比。

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

即左：42％是在容器寬度（或窗口寬度）的42％時，上邊距爲容器高度（或窗口高度）的13％....所以如果窗口調整大小並且容器調整測量值更改。使用像素或其他絕對測量值而不是相對測量值，如百分比。