如何将多个字母列表居中对齐

How to align more than one DIVs which list of letters to the center

<div class="main">
<div class="list">
<br>ABCD
<br>ABC
<br>AB
<br>A
</div>

<div class="list">
<br>ABCD
<br>ABC
<br>AB
<br>A
</div>
</div>

我希望这些 DIV 与页面中心对齐(就像 table 的列与页面中心对齐)并且文本对齐应该左对齐(向左浮动)

我如何使用 css

来做到这一点

使用这个

.main{
    display:table;
    text-align:center;
    margin:0 auto;
    }
.main .list{
    text-align:left;
    display:table-cell;
}

在 p 标签中添加文本并给出以下 css:

p {
    display: inline-block;
    text-align: left;
}
.main {
    text-align: center;
}

勾选Fiddle.