html - ラッパーの後にコンテンツを整列させる方法は?

Question

私はコンテンツを配置しようとしています: g_image5 はラッパー全体の背景のように使用します image7 は g_image5 text3 上のバナーであり、その段落であり、ラッパーの中央に配置しました 私の解像度では表示されます中央に表示されますが、たとえば高解像度では左側に表示されます。left:28,5% に揃えると、幅 100% の html サイズの後に移動するためだと思います。私の質問は次のとおりです。コンテンツがその後に配置されるようにするには、ラッパーにどのように記述すればよいですか?

html
{
    width:100%;
    height:100%;
    overflow-y:auto;
}

<div id="wrapper" width=100% z-index:-1>
    <div id="g_image5" style="position:absolute; overflow:hidden; left: 23%; top: 18%;   
width:55%;  z-index:0"><img src="images/content2.jpg" alt="" title="" border=0   
width=100% height=150%></div>
    <div id="image7" style="position:absolute; overflow:hidden; left:38%; top:20%;    
width:25%; height:13%; z-index:3"><img src="images/2.png" alt="" title="" border=0  
width=100% height=100%></div>
    <div id="text3" style="position:absolute; overflow:hidden; left:28.5%; top:40%;      
width:50%; height:20%; z-index:3">
        <div class="wpmd">
            <div><font face="Tahoma" class="ws13">Here is a paragraph and here's also the problem</font></div>
      </div>
    </div>
</div>