如果一个兄弟姐妹需要弯曲，则将其应用于所有兄弟姐妹

Question

示例问题：

• 大：https://i.imgur.com/fVUSqJN.png
• 小：https://i.imgur.com/6DOaBIf.png

[当没有足够的空间时，一行开始弯曲，但其他行如果仍然有足够的空间就不会弯曲，我是否可以这样做，所以如果至少有必要的话，每一行都可以弯曲？

所以我想要this而不是this >>

资产：

• “ T”：https://i.imgur.com/KxoIf6b.png
• “带X的框：

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510 510"><title>x</title><line x1="5" y1="5" x2="505" y2="505" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:10px"/><line x1="5" y1="505" x2="505" y2="5" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:10px"/><rect x="5" y="5" width="500" height="500" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:10px"/></svg>
html：

<div className='container'>
  <div className='container__side top'>
    <div className='container__row nameone'>
      <img className='container__type' src='...'/>
      <svg className='container__item' ... />
      // each row have different amount of svg items, because it loop throw array fecthed from api
    </div>
    <div className='container__row nametow'>
    </div>
    // etc
  </div>
  <div className='container__side bottom'>
  </div>
</div>
scss：

.container {
   background: white;
   display: flex;
   flex-direction: column;
   padding: 1rem;

   &__row {
     display: flex;
   }

   &__type {
      margin-right: 2rem;
      width: 5rem;
      height: 5rem;
      object-fit: contain;
   }
   &__item {
      padding: .5rem;
      width: 7rem;
      height: 7rem;
   }
}

[示例问题：大：https://i.imgur.com/fVUSqJN.png小：https://i.imgur.com/6DOaBIf.png当空间不足时，一行开始弯曲，但另一行赢了如果还没有足够的空间，...

Answer 1

您可以仅将flex-shrink: 0;添加到&__item。