Html 每行3行的简单css不'；行不通

我有一些简单的flex行，我试图将它们排成一行，但由于某些原因，它不起作用。他们是一个接一个的

我在这里创建了演示：

。页面内容{
最大宽度：1366px；
宽度：100%；
左边距：自动；
保证金权利：10%；
填充顶部：50px；
}
部分{
显示：块；
}
.柔性容器{
-ms-flex-wrap:wrap；
柔性包装：包装；
-webkit盒包：中心；
-ms-flex-pack:center；
证明内容：中心；
}
.flex容器>div{
弹性基准：30%；
保证金：5px；
}

标题

一些文本

看起来您忘记了显示：flex

.flex-container{
  display: flex;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

---

编辑：一个解释。。。您需要display属性将容器定义为flexbox，这就是告诉该元素的子元素他们应该使用flex上下文的原因。

看起来您忘记了

display:flex

.flex-container{
  display: flex;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

---

编辑：一个解释。。。您需要display属性将容器定义为flexbox，这就是告诉该元素的子元素他们应该使用flex上下文的原因。

您的flex容器缺少flex样式

。页面内容{
最大宽度：1366px；
宽度：100%；
左边距：自动；
保证金权利：10%；
填充顶部：50px；
}
部分{
显示：块；
}
.柔性容器{
-ms-flex-wrap:wrap；
柔性包装：包装；
-webkit盒包：中心；
-ms-flex-pack:center；
证明内容：中心；
显示器：flex；
}
.flex容器>div{
弹性基准：30%；
保证金：5px；
}

标题

一些文本

标题

一些文本

标题

一些文本

您的flex容器缺少flex样式

。页面内容{
最大宽度：1366px；
宽度：100%；
左边距：自动；
保证金权利：10%；
填充顶部：50px；
}
部分{
显示：块；
}
.柔性容器{
-ms-flex-wrap:wrap；
柔性包装：包装；
-webkit盒包：中心；
-ms-flex-pack:center；
证明内容：中心；
显示器：flex；
}
.flex容器>div{
弹性基准：30%；
保证金：5px；
}

标题

一些文本

标题

一些文本

标题

一些文本

您的

.flex容器是否应该具有
显示：flex
？您的
flex容器是否应该具有
显示：flex
？谢谢您的回答。奇怪，但在小提琴上工作，但在网页上不工作。我不知道你在使用什么浏览器，但也许可以检查一下，看看你是否使用了适当的？（编辑以添加更好的链接）或者您正在使用外部链接，即页面上包含CSS的外部库，而您没有将其包含在小提琴中？像
font--h5
这样的类听起来像是框架的一部分。谢谢你的回答。奇怪，但在小提琴上工作，但在网页上不工作。我不知道你在使用什么浏览器，但也许可以检查一下，看看你是否使用了适当的？（编辑以添加更好的链接）或者您正在使用外部链接，即页面上包含CSS的外部库，而您没有将其包含在小提琴中？像
font--h5
这样的类听起来像是框架的一部分。然后问题就出在其他方面了。当我添加图像和文本时，它们会一个接一个。一切都一样。我只是添加了图片、标题和摘录……然后问题就出在其他方面了。当我添加图像和文本时，它们会一个接一个。一切都一样。我只添加图片、标题和摘录。。