并排显示页面中央的图像

Question

我有以下代码，它从数据库加载我的所有图像路径：

    <% sweet.forEach(function (item) { %>
    "img id="pictureproduct" src="<%= item.picture%>"/>
    <% }); %>

我尝试了我所知道的所有内容，使图片加载如下：

• 图片应加载在页面中央
• 图像应该并排
• 只有4或5张图像应并排加载一行

你可以用CSS以某种方式帮助我吗？

Answer 1

将图像放入Flex容器（flexbox）中。创建div <div class="images-parent">并将图片放入：

.images-parent{
   display:flex;
   justify-content:center;
}

Answer 2

试试这个：

nullable: false

如果你想改变图像的高度，你也必须更改margin-top。