Flex div(全幅を伸ばさない)[複製]

Dec 07 2020

私は2つのdivを持っていて、flexを使用しています:

.parent {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: red;
}

.item {
  height: 40px;
  margin-bottom: 10px;
}

<div class="parent">
  <div class="item">something here</div>
</div>

私の問題は、親が画面の幅の100%であるということです。

アイテムのコンテンツと同じ大きさのままにして、自動で拡大するようにするにはどうすればよいですか(テキストが多い場合は、少なくても拡大または縮小されます)。

回答

1 fahimchowdhury Dec 07 2020 at 18:06

フレックスの代わりにインラインフレックスを使用します。

display: inline-flex;