使用css在图像上定位链接

我有一个链接和一个图像。我想使用css绝对定位来定位图像上的链接，但是如果我使用css绝对定位，那么如果用户使用的是较大的显示器或较小的显示器，链接将无法正确定位。我怎样才能使它在所有显示器上都能正常工作并正确定位。

选项一确实很愚蠢，但只需移动链接，使其环绕图像即可

<a href="http://www.example.com"><img src="http://placehold.it/350x150"></a>

---

尽可能将图像设置为背景图像，重新格式化如下。（这是一种更好的做法）

是否有理由它必须是前景图像？让我知道，我可能会有一个具体的建议

---

请给我们展示一个关于JSFIDLE的例子，并说明你的代码和你期望它应该是什么样子。它没有显示确切的问题，但基本上问题是当监视器变大时链接会移动。你总是在你的问题中发布有问题的代码。你能在JSFIDLE上发布一个演示吗

#divwithimage { 
   background: url("../images/sweet.jpg");
   background-repeat: no-repeat;
   width: 500px;
   height: 500px;
   position: relative; // as this will act as parent
}

button {
  position: absolute; // absolute to container above
  left: 0;
  top: 0;
  width: 200px;
  height: 40px;
  background: pink;
}