你如何居中对齐html div中的内联元素？

Question

我在固定宽度div中有一堆跨度。我想让跨度按照设计进行内联流动。但是，我希望它们以每一行为中心而不是左对齐。我怎么能用css来实现呢？

<div>
         <span>text1</span>
         <span>text2</span>
         <span>text3</span>
         <span>text4</span>
         <span>text5</span>
         <span>text6</span>
         <span>text7</span>
         <span>text8</span>
         <span>text9</span>
         <span>text10</span>
</div>

Answer 1

只需将text-align: center设置为div <div class="dummy">即可。像这样......

.dummy {
    width: 500px;
    text-align: center;
}

jsFiddle DEMO

希望这就是你所追求的目标。

Answer 2

设置包含跨距的div的宽度并执行以下操作：

span {
        width: 100%;
        text-align: center;
        float: left;
        clear: both;
    }