CSS中文本居中问题

CSS文本水平居中问题:

<div class="xtx-copyright">
        <div class="container">
            <p>
                <a href="#">关于我们a> 
                <span>|span>
                <a href="#">帮助中心a> 
                <span>|span>
                <a href="#">售后服务a> 
                <span>|span>
                <a href="#">配送与验收a> 
                <span>|span>
                <a href="#">商务合作a> 
                <span>|span>
                <a href="#">搜索推荐a> 
                <span>|span>
                <a href="#">友情链接a>
            p>
            <p>p>
        div>
    div>

.xtx-copyright {
    background-color: #333;
    height: 168px;
}
.xtx-copyright .container{
    height: 168px;
    width: 1240px;
    margin: 0 auto;
    color: #999;
    font-size: 14px;
    text-align: center;
}

.xtx-copyright .container a {
    color: #999;
    text-decoration: none;
}

按照正常的逻辑文本应该已经水平居中了


.xtx-copyright {
  background-color: #333;
  height: 168px;
}

.xtx-copyright .container {
  height: 168px;
  width: 1240px;
  margin: 0 auto;
  color: #999;
  font-size: 14px;
  text-align: center;
}

.xtx-copyright .container a {
  color: #999;
  text-decoration: none;
  display: inline-block;
  vertical-align: middle;
}