Wie kann ich die Breite eines Flexbox-Kinds anhand seines Inhalts bestimmen?

Breite des untergeordneten Flexbox-Elements

Ein übergeordnetes Container-Div mit Anzeige: Flex hat ein untergeordnetes Element a. Wie kann das Kind „inline“ erscheinen, wobei seine Breite durch seinen Inhalt bestimmt wird?

Lösung

Verwenden Sie align-items: flex-start auf dem Container oder align-self : Flex-Start bei jedem Kind.

Analyse

Flex Container haben die Standardeinstellung align-items: stretch, wodurch untergeordnete Elemente entlang der Querachse erweitert werden. Durch das Festlegen von align-items: flex-start oder align-self: flex-start können Sie eine Erweiterung der untergeordneten Breite verhindern und ein Inline-Erscheinungsbild erzielen.

Zusätzliche Informationen

• align-self gilt für einzelne Flex-Elemente, während align-items für den gesamten Container gilt.
• align-items: flex-start sorgt für die Ausrichtung quer zur Achse am Anfang des Behälters.

• Weitere Informationen zur Flex-Ausrichtung finden Sie unter:

  • [Wie funktioniert Flex-Wrap?](link1 )
  • [Warum gibt es keine „justify-items“ und „justify-self“ Eigenschaften?](link2)

Das obige ist der detaillierte Inhalt vonWie kann ich die Breite eines Flexbox-Kinds anhand seines Inhalts bestimmen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!