css 잘하시는분 좀 봐주세요 ㅠㅠ

게시판 밑에 페이지 버튼을 만들어서 넣었는데요.

이게 화면에서 자꾸 왼쪽으로 치우쳐서 화면을 줄이고 늘리면 같이 안움직이고 고정되어있어요 ㅠㅠ

아시는분 좀 도와주세요~

<div class="page">

<span class="prev">이전</span> <span class="pageNum <?=$nowPage?>"><?=$i?></span> <span class="next">다음</span>

</div>

/*page css*/
.page{
 margin: 10px 0px 0 0;
 width: 100%;
 color: #4b4b4b;
 text-align: center;
}

.page span{
 float: left;
 background: #f2f2f2;
 margin: 0 0 0 7px;
 color: 4b4b4b!important;
 }

.page .prev,.pageNum,.page .next{
 border: 1px solid #ccc;
 padding: 6px 9px 6px 9px;
 display: block;
 border-radius: 3px;
 background: url("/images/buttonGray.png") repeat-x left bottom;
 box-shadow: 0 0 2px 0 rgba(0,0,0,.15);
 color: #4b4b4b!important;
 }
.page .pageNum{
 color: #4b4b4b!important;
 box-shadow: 0 0 2px 0 rgba(0,0,0,.15) 
}

.page .nowPage{
 font-weight: bold;
 color: #2662bb!important;
}​