正确的过程覆盖一个小部件 - 相对和绝对？

Question

我有一个事件插件，在我们的Wordpress网站上列出了3个事件。我希望有一个链接到页面上所有事件的图形。

我通过使用文本小部件创建带有 href 链接的图形来做到这一点。然后将其设置为绝对和定位。问题是当网站响应时，图形会移位。

Ss 可以使用相对和绝对定位将小部件绑定到另一个小部件的任何方法。因此，尽管屏幕分辨率有任何变化，它始终保持在右下角。

Answer 1

你可以

通过使用bottom和right而不是绝对定位中的top和left来做到这一点。

在下面的示例中，当您调整大小时，"meow"span将保持锚定在右下角。

html,
body,
div {
  height: 100%;
}
div {
  position: relative;
  border: 1px solid red;
}
span {
  position: absolute;
  bottom: 20px;
  right: 20px;
  background-color: green;
  color: white;
  padding: 4px;
}

<div>
  <span>meow</span>
</div>