Javascript 如何对齐html？

我使用display

flex

在一个大容器中显示多个项目（

parentDiv

）。代码运行良好，但我在水平居中项目时遇到了大问题（特别是如果只有少数项目应该水平居中），因此我使用了

justify content

导致大问题的原因：

父div

无法再显示所有

项。显示的第一个项目是项目“04”，而它应该是“01”。如何避免这种情况

请查看此代码：


#bigDiv{
位置：绝对位置；
宽度：100%；
身高：100%；
}
#家长课{
宽度：90%；
身高：50%；
溢出y：隐藏；
溢出-x：滚动；
文本对齐：居中；
空白：nowrap；
背景：红色；
显示器：flex；
证明内容：中心；
对齐项目：居中；
}
.项目{
颜色：白色；
背景：蓝色；
弹性：04%；
利润率：0.3%；
}
.项目：：之后{
内容：“；
显示：块；
垫底：100%；
}

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
您将
160%
安装到
100%
中。你想让它居中。它是有效的：
160%
生成的子对象的总宽度很好地居中

但你也希望父母之外的任何东西都可以访问

这很像是让一个子元素在父元素之外向左或向上移动-30%（通过任何其他方法），并期望父元素允许您滚动到它。这不会发生的

如果它这样做了，则子项将不再位于
-30%
，而是位于
0%
。滚动条永远不会滚动到左侧或顶部负空间。这是设计的。在设计页面时，您需要将其考虑在内

当你将一个较大的孩子放在一个较小的家长中间时，你将无法使用家长的滚动条滚动到孩子的开头。因此任何阻止孩子定位在家长左侧负空间的事情都会解决它。
您将
160%
安装到
100%
中。你想让它居中。它是有效的：
160%
生成的子对象的总宽度很好地居中

但你也希望父母之外的任何东西都可以访问

这很像是让一个子元素在父元素之外向左或向上移动-30%（通过任何其他方法），并期望父元素允许您滚动到它。这不会发生的

如果它这样做了，则子项将不再位于
-30%
，而是位于
0%
。滚动条永远不会滚动到左侧或顶部负空间。这是设计的。在设计页面时，您需要将其考虑在内

当你将一个较大的孩子放在一个较小的家长中间时，你将无法使用家长的滚动条滚动到孩子的开头。因此任何阻止孩子定位在家长左侧负空间的事情都会解决它。
你能非常清楚地说明你想要的意图吗将
flex-wrap:wrap
添加到
#parentDiv
？那么请看一下图片，我希望你能看到：）@jgallardowh我应该编辑“flex-wrap:wrap”吗？这将扼杀一切：ß@BelderMy意图：父div应该能够显示所有项目，然后只减少左/右边距，比如说1%，问题解决了。我个人不明白为什么要使用
justify content:center在这里，没有必要，没有就可以了。你能非常清楚地说明你想要的意图吗将
flex-wrap:wrap
添加到
#parentDiv
？那么请看一下图片，我希望你能看到：）@JGallardoWhy我应该编辑“flex-wrap:wrap”？这将扼杀一切：ß@BelderMy意图：父div应该能够显示所有项目，然后只减少左/右边距，比如说1%，问题解决了。我个人不明白为什么要使用
justify content:center这里，不需要，没有就可以了。