css - CSS:居中，但将内容向左对齐

我希望整个块都以其父对象为中心，但是我希望该块的内容保持对齐。

例子最好

在本页 :

http://yaml-online-parser.appspot.com/?yaml=%23+ASCII+Art%0d%0a---+%7c%0d%0a++%5c%2f%2f%7c%7c%5c%2f%7c%7c%0d%0a++%2f%2f+%7c%7c++%7c%7c__%0d%0a&type=python

ascii艺术应居中(如显示)，但应对齐并看起来像“YAML”。

或这个 :

http://yaml-online-parser.appspot.com/?yaml=%3f+-+Detroit+Tigers%0d%0a++-+Chicago+cubs%0d%0a%3a%0d%0a++-[phone]%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适应其子代的宽度，并使用ojit_code使它持有的内容根据需要向左对齐。

<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>

关于css - CSS:居中，但将内容向左对齐，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/1269589/