【问题标题】:Alignment of flex items [closed]弹性项目的对齐[关闭]
【发布时间】:2022-02-12 00:39:33
【问题描述】:

我有一个包装器,它是 display:flex,并且在水平方向上均等地隔开项目。这些项目也有display:flex,但也是flex-direction:column,这些基本上是一个图像和一个包裹在按钮中的跨度。发生的情况是,当跨度中断成 2 行时,它会使图像的顶部未对齐,因此它们看起来不合线,有没有办法解决这个问题?

You can see the problem here

【问题讨论】:

标签: html css


【解决方案1】:

您的主 .bottle-refill-options 容器中有 align-items: center,它垂直居中所有内容。

将其更改为align-items: flex-start;,您的所有项目都将沿顶部垂直居中,给出您想要的外观(我认为)

【讨论】:

  • 好尴尬,我怎么没看到!
猜你喜欢
  • 1970-01-01
  • 2019-10-04
  • 1970-01-01
  • 1970-01-01
  • 2017-06-18
  • 2014-04-21
  • 2020-12-20
  • 1970-01-01
相关资源
最近更新 更多