Flex div (ne pas étirer sur toute la largeur) [dupliquer]

Dec 07 2020

J'ai 2 divs et j'utilise 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>

Mon problème est que le parent fait 100% de la largeur de l'écran.

Comment puis-je faire en sorte qu'il reste aussi grand que le contenu de l'élément, de sorte que la taille automatique augmente (quand il y a plus de texte, elle augmente ou diminue avec moins)?

Réponses

1 fahimchowdhury Dec 07 2020 at 18:06

Utilisez inline-flex au lieu de flex:

display: inline-flex;