css - 边距对齐因不同分辨率而损坏

Question

我在我的网站中使用了两张图片 - 一张在右上角，另一张在右上角。

右上角图片css代码

.fbtopbutton{ position: absolute;top: 27px;right: 192px;}

居中右图css代码

#annoying-floater {
  z-index:10;
  position:fixed;
  top:80%; right:-45%;
  width:640px; height:480px;
  margin-left:-320px; margin-top:-240px;
opacity: 0.8; /* css standard */
    filter: alpha(opacity=60); /* internet explorer */
}

#annoying-floater:hover {

opacity: 1.0; /* css standard */
    filter: alpha(opacity=60); /* internet explorer */
}

有两个问题：

1. 当屏幕分辨率变低时，图像会进入页面中心（在内容上）
2. 对于右中图片，当鼠标悬停在该图片下方时，它的工作方式就像鼠标悬停在图片上一样。

Answer 1

在 CSS 中以百分比为单位设置这些图像的宽度和高度。