javascript - 如何在一行中获得3个div？ Flex不起作用

我正在尝试将所有3个div并排放置，但这没有发生。我想将它们对齐成一排，并且它们之间具有相等的间距。
Flex显示无法正常工作。
知道为什么它不起作用以及如何将所有3个div排成一行吗？

.package{
	border: solid 1px black;
	display: flex;
	flex-flow: row wrap;
	height: 500px;
	width: 380px;
	text-align: center;
}

<h2 class="packages">PACKAGES</h2>
    <div class="package">

    </div>
    <div class="package">

    </div>
    <div class="package">

    </div>

HTML代码

<h2 class="packages">PACKAGES</h2>
            <div class="package">

            </div>
            <div class="package">

            </div>
            <div class="package">

            </div>

CSS代码

.package{
border: solid 1px black;
display: flex;
flex-flow: row wrap;
height: 500px;
width: 380px;
text-align: center;

}

输出值

最佳答案

您的容器需要显示Flex。像这样：

.package-container {
  display: flex;
  flex-flow: row wrap;
}

.package {
  border: solid 1px black;
  height: 500px;
  width: 380px;
  text-align: center;
}

<h2 class="packages">PACKAGES</h2>
<div class="package-container">
  <div class="package">1</div>
  <div class="package">2</div>
  <div class="package">3</div>
</div>

关于javascript - 如何在一行中获得3个div？ Flex不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/60307670/