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

小编典典

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

错误消息应该像在控制台中一样全部对齐。

阅读 1273

2020-05-16

共1个答案

小编典典

重新提出另一个问题的有效答案：如何使宽度可变的浮动元素水平居中？

假设将浮动并居中的元素是一个具有id =“ content”的div …

<body>
<div id="wrap">
   <div id="content">
   This will be centered
   </div>
</div>
</body>

并应用以下CSS

#wrap {
    float: left;
    position: relative;
    left: 50%;
}

#content {
    float: left;
    position: relative;
    left: -50%;
}

2020-05-16