css在不同分辨率下下移,CSS：在不同屏幕分辨率下的图像位置更正

我只是使用HTML和CSS屏蔽了网站上的不同图像，而且我遇到了以较小分辨率移动到屏幕右侧的符号问题。CSS：在不同屏幕分辨率下的图像位置更正

实际图像我想(和出现在1600x1024分辨率)看起来像这样：http://i.imgur.com/hsGT14m.jpg

整个页面的HTML代码如下：

整个页面的CSS如下：

img.bg {

/* Set rules to fill background */

min-height: 100%;

min-width: 1024px;

/* Set up proportionate scaling */

width: 100%;

height: auto;

/* Set up positioning */

position: fixed;

top: 0;

left: 0;

z-index: -2;

}

@media screen and (max-width: 1024px) { /* Specific to this particular image */

img.bg {

left: 50%;

margin-left: -512px; /* 50% */

}

}

img.titlebox {

/*Keep it bounded for different resolutions*/

max-width: 100%;

height: auto;

width: auto\9; /* ie8 */

/*Position*/

position: absolute;

top: 0;

left: 50%;

margin-left: -500px;

z-index: -1;

}

img.symbol {

/*Keep it bounded for different resolutions*/

max-width: 100%;

height: auto;

width: auto\9; /* ie8 */

margin:auto;

/*Position*/

position: absolute;

top: 5%;

left: 20%;

}

div.containsymbol {

width:100%;

margin:auto;

}

img.transbox {

/*Keep it bounded for different resolutions*/

max-width: 100%;

height: auto;

width: auto\9; /* ie8 */

/*Opacity*/

opacity:0.4;

filter:alpha(opacity=40); /* For IE8 and earlier */

/*Position*/

position: absolute;

top: 21.5%;

left: 50%;

margin-left: -500px;

z-index: -1;

}

}

我认为这是符号绝对位置的问题，而相对定位可能是一个解决方案，但我缺乏经验来了解如何实现自己的解决方案9并且可能适用于哪些我不是目前正在使用)。

我希望我在这里提供了足够的信息，并期待任何人能给予的帮助。