CSS：居中块，但内容向左对齐

我希望整个块位于其父级的中心，但我希望块的内容左对齐。

例子最有效

在本页 ：

ascii 艺术应该居中（正如它所显示的那样），但它应该对齐并且看起来像“YAML”。

或这个 ：

http://yaml-online-parser.appspot.com/?yaml=%3f+-+底特律+老虎%0d%0a++-+芝加哥+幼崽%0d%0a%3a%0d%0a++-+2001-07-23 %0d%0a%0d%0a%3f+%5b+新+纽约+洋基%2c%0d%0a++++亚特兰大+勇士+%5d%0d%0a%3a+%5b+2001-07-02%2c+ 2001-08-12%2c%0d%0a++++2001-08-14+%5d%0d%0a http://yaml-online-parser.appspot.com/?yaml=%3f+-+Detroit+Tigers%0d%0a++-+Chicago+cubs%0d%0a%3a%0d%0a++-+2001-07-23%0d%0a%0d%0a%3f+%5b+New+York+Yankees%2c%0d%0a++++Atlanta+Braves+%5d%0d%0a%3a+%5b+2001-07-02%2c+2001-08-12%2c%0d%0a++++2001-08-14+%5d%0d%0a

错误消息应该像在控制台中一样全部排列起来。

首先，创建一个父级div其子内容集中于text-align: center。接下来，创建一个孩子div使用display: inline-block适应其子级的宽度和text-align: left使其保存的内容根据需要向左对齐。

<div style="text-align: center;">
    <div style="display: inline-block; text-align: left;">
        Centered<br />
        Content<br />
        That<br />
        Is<br />
        Left<br />
        Aligned
    </div>
</div>

如果您希望确保长线不会使所有内容变宽太多，您也可以应用max-width属性（具有您选择的值）到内部标记：

max-width: 250px;