css文字居中

遇到了一个无法解释的问题

    <span class="description">编辑与5小时前</span>

元素css设置如下

.description{
        height: 30px;
        line-height: 30px;
        margin: 0;
        padding: 0;
      }

可以看到元素并没有居中对齐

把元素加上border 以后就居中了

 .description{
        height: 30px;
        line-height: 30px;
        border: 1px solid transparent;
        margin: 0;
        padding: 0;
      }