如何使换行div没有显示:inline-block;?

Question

所以我希望外部div之外的内部div根据外部div的宽度进行换行，而外部div又根据浏览器窗口的宽度展开和收缩。我知道我可以用display: inline-block;让这些分号互相缠绕但是当它们那样做的时候分号不会水平居中。text-align: center;和分配display: flex;+justify-content: center;不起作用

Answer 1

也许你只需要添加flex-wrap: wrap;

.container {
display: flex;
justify-content: center;
flex-wrap: wrap;
}

这是一个工作演示。

Answer 2

html:

<div class="LabelColumn">label column</div>
<div class="DataColumn">data column</div>

css:

div.LabelColumn
{
padding: 10px;
width: 150px;
float: left;
margin:10px;
border:1px solid #333;
}
div.DataColumn
{
padding: 10px;
width: 150px;
float: left;
margin:10px;
border:1px solid #333;
}

在这里你可以看到一个例子，我想它会帮助你。