CSS 灵活显示和段落居中

Question

我正在尝试使用 display: flex 而不是 float: left 在 div 中将段落彼此相邻放置，然后我想将所有段落放置在这个 div 到屏幕中央（目前 display: flex 和 float: left 它们都位于屏幕左侧）

我正在尝试使用：

#div {display: flex; align-items: center;}

在我的 css 中，但没有成功。

有经验的人可以告诉我怎么做吗？我一直在摆弄所有不同的属性 - 无论我做什么，文本都绑定到左侧。

Answer 1

只需添加 justify-content 属性

The justify-content property aligns the flexible container's items when the items do not use all available space on the main-axis (horizontally).

#test{
    display: flex;
    background-color: white;
    align-items: center;
    justify-content: center;
}

CSS Flex display and centering of paragraphs