居中ul内div

Question

我很努力得到一个<ul>包含分页链接集中在其父div。我不确定<ul>是处理这个问题的最佳方法，但是我能想到的只有在<div class="pagination">之间水平显示链接（浮动似乎无效）的唯一方法。

HTML/PHP

<div class="pagination">  
     <ul> 
      <li><?php previous_post_link('<span class="left-arrow"></span> older posts'); ?></li> 
      <li><?php next_post_link('<span class="right-arrow"></span> newer posts'); ?></li> 
     </ul>    
    </div><!-- end pagination --> 

CSS

#blog .pagination { 
    background: url('img/arrow_left.png') no-repeat; 
    height: 169px; 
    width: 635px; 
    float: right; 
    margin-right: 14px; 
    padding-bottom: 20px; 
} 

#blog .pagination ul li { 
    display: inline; 
    margin: 0 auto; 
    width: 290px; 
} 

#blog .pagination .left-arrow { 
    float: left; 
    background: url('arrow_left.png') no-repeat; 
} 

#blog .pagination .right-arrow { 
    padding-left: 50px; 
    background: url('arrow_right.png') no-repeat; 
} 

live site

Answer 1

.pagination { 
    width: 500px; 
    background:#eee; 
    text-align:center; 
} 

.pagination ul { 
    display:inline; 
    margin: 0 auto; 
} 

.pagination ul li { 
    display: inline; 
    margin:5px; 
} 

Answer 2

只是做

#blog .pagination ul{ 
width:100%; 
display:block; 
text-align:center; 
} 
#blog .pagination ul li{ 

display:inline-block; 
width:auto;/* to clean you style*/ 
} 

我检查了它，它在您的网站工作

编辑：我忘了箭头

#blog .pagination .left-arrow { 
    background: url("arrow_left.png") no-repeat scroll right center transparent; 
    float: left; 
    padding: 10px 25px; 
} 
#blog .pagination .right-arrow { 
    background: url("arrow_right.png") no-repeat scroll 0 0 transparent; 
    float: right; 
    padding: 10px 25px; 
}