div 중앙정렬에 대해서 질문좀할게요 ㅠㅠ

<!--메인 배너 css 시작-->
<style type="text/css">
<style type="text/css">
* {margin:0; padding:0;}
div.slider_wrap {
position:relative;
float:left;
width:963px;
height:433px;
}
div.slider_wrap ul.slider { position:absolute; }
div.slider_wrap ul.slider li { display:none; position:absolute; top:0; left:0; }
div.slider_wrap div.slider_button {
position:absolute;
z-index:10;
bottom:260px;
width: 100%;
height: 24px;
}
#slider1 {
width:100%;
height:500px;
overflow:hidden;
margin:0 auto;
position:relative;

}
* html #slider1.slider_wrap {} /* IE6 hack */
</style>
<!--메인 배너 css 끝-->

<!-- 메인 배너 시작 -->
<div id="slider1" class="slider_wrap">
<ul class="slider">
<!-- 첫번째 배너 이미지 -->
<li style="display:block;"><a href="#">
<img src="main_g/point_1.jpg" onerror="showDefaultProductHIMG(this)" /></a></li>

<!-- 두번째 배너 이미지 -->
<li> <a href="#" >
<img src="main_g/point_2.jpg" onerror="showDefaultProductHIMG(this)" /></a></li>

<!-- 세번째 배너 이미지 -->
<li> <a href="#">
<img src="main_g/point_1.jpg" onerror="showDefaultProductHIMG(this)" /></a></li>

<!-- 네번째 배너 이미지 -->
<li> <a href="#">
<img src="main_g/point_2.jpg" onerror="showDefaultProductHIMG(this)" /></a></li>

<!-- 다섯번째 배너 이미지 -->
<li> <a href="#" >
<img src="main_g/point_1.jpg" onerror="showDefaultProductHIMG(this)" /></a></li>

</ul>
<div class="slider_button">
<table width="100%" align="center" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="padding-left:100px;" ><a href="#" class="prev"><img src="main_g/prev.png" align="left" /></a></td>
<td style="padding-right:100px;" ><a href="#" class="next"><img src="main_g/next.png" align="right" /></a></td>
</tr>
</table>
</div>
</div>
<!-- 메인 배너 끝 -->


그누보드 홈페이지 제작하다가 메인 제이쿼리 슬라이드를 넣었는데요.
전체화면으로 보았을땐 괜찮은데

화면이 줄게 되면 슬라이드 이미지가 중앙정렬되어서 딱 보여야되는데..
화면이 줄게 되면 왼쪽 정렬되어 보이네요

화면이 작아진 상태에서는 슬라이드 이미지 중앙이
안보이고 왼쪽으로 붙어서 보이네요..

http://happybean.naver.com/ <<네이버 슬라이드 비슷하게 만들려고 했는데
위 주소 처럼 익스플로러 창이 줄어도 슬라이드 이미지가 중앙정렬되게 할수 있나요 ㅠㅠ

혼자 하려다가.. 이틀정도 고민했는데 안되네요.. 고민하다가 올려봅니다...