Flex div (nicht über die gesamte Breite strecken) [Duplikat]

Dec 07 2020

Ich habe 2 Divs und benutze 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>

Mein Problem ist, dass das übergeordnete Element 100% der Breite des Bildschirms entspricht.

Wie kann ich es so gestalten, dass es so groß wie der Elementinhalt bleibt, sodass es automatisch wächst (wenn mehr Text vorhanden ist, wächst oder schrumpft es mit weniger)?

Antworten

1 fahimchowdhury Dec 07 2020 at 18:06

Verwenden Sie Inline-Flex anstelle von Flex:

display: inline-flex;