css 为什么我不能使用网格对齐内容属性？

11dmarpk 于 2023-01-10 发布在其他

关注(0)|答案(2)|浏览(130)

我想像横幅一样对齐图像。但是当我使用网格和对齐内容：结束时，图像对齐行。我看了chrome检查器，它说使用flex。为什么网格不能使用对齐内容？

body {
  margin: 0;
}

.icon {
  height: 30px;
  width: 30px;
}

#iconbanner {
  display: grid;
  background-color: gray;
  justify-content: end;
}

<div id="iconbanner">
  <img src="blog.png" class="icon">
  <img src="youtube.png" class="icon">
  <img src="instagram.png" class="icon">
</div>

我试过网格和正义--内容：结束;但不能对齐图像列。

css

来源：https://stackoverflow.com/questions/75030112/why-i-cant-use-justify-content-property-with-grid

2条答案

按热度按时间

py49o6xq1#

在网格中，使用justify-items代替justify-content。

赞(0）回复(0）举报 2023-01-10

xienkqul2#

你可以这样做（我在图片之间添加了一个gap）：

body {
  margin: 0;
}

.icon {
  height: 30px;
  width: 30px;
}

#iconbanner {
  display: grid;
  gap: 5px;
  background-color: gray;
  grid-template-columns: repeat(3, auto);
  justify-content: end;
}

<div id="iconbanner">
  <img src="blog.png" class="icon">
  <img src="youtube.png" class="icon">
  <img src="instagram.png" class="icon">
</div>

赞(0）回复(0）举报 2023-01-10

我来回答

css 为什么我不能使用网格对齐内容属性？

2条答案

相关问题

热门标签

最新问答