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

  • Z时代
  • 2024-01-10
  • 分类：问答

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

例子最有用

在本页面 ：

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

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

回答：

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

假设将浮动并居中的元素是一个具有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%;
}

以上是 CSS：居中，但将内容向左对齐 的全部内容， 来源链接： utcz.com/qa/433246.html

回到顶部