html - 相对定位里面的绝对定位

Question

我的短代码有点问题。 Here你会找到我的网站。
它只是一个带有按钮的图像。我的问题是，现在当我想缩放浏览器窗口时，按钮会四处移动。因此，该按钮将位于不同浏览器、计算机、手机...的任何其他位置。

这是我的代码:

<center>

<div style="position: relative; left: 0; top: 0;">
  <img src="/images/home2.png" style="position: relative; bottom: 0; left: 0;"/>
    <div style="position: absolute; right: 300; bottom: 250;">
      <a href="http://www.pugganagga.com/"><img src=" /images/button.gif " onmouseover="this.src='  /images/button2.gif '" onmouseout="this.src='  /images/button.gif '"  /></a>
    </div>
</div>

</center>

Answer 1

试试这个:

<div style="position: relative; left: 0; top: 0; margin: 0 auto; width:892px">
  <img src="/images/home2.png" style="position: relative; bottom: 0; left: 0;">
  <div style="position: absolute; right: -145px; bottom: 250;">
    <a href="http://www.pugganagga.com/"><img src="  /images/button.gif " onmouseover="this.src='  /images/button2.gif '" onmouseout="this.src='  /images/button.gif '"></a>
  </div>
</div>