Warum verkleinern sich die Eingabeelemente meines Flex-Containers nicht?

Flex-Container-Elemente schrumpfen nicht

Beim Versuch, Flex und Flex-Grow innerhalb eines Flex-Containers zu nutzen, in dem Eingabe- und Knopfelemente untergebracht sind, ist das zu erwarten Möglicherweise tritt kein Verhalten bei der Größenänderung auf. Diese Anomalie ergibt sich aus der Standardbreite, die Browser Eingabeelementen im Gegensatz zu Divs zuweisen.

Unten ist ein Ausschnitt, der die automatische Breitenzuweisung des Browsers zeigt:

In diesem Szenario die Browserattribute eine festgelegte Breite für die Eingabe, unabhängig von den Flex-Einstellungen.

Beachten Sie Folgendes:

input {
  border: 1px solid blue;
  display: inline;
}

div {
  border: 1px solid red;
  display: inline;
}

Im bereitgestellten Snippet behält das Eingabeelement seine Standardbreite bei, während das div Passt sich den Abmessungen des Flex-Containers an.

Das obige ist der detaillierte Inhalt vonWarum verkleinern sich die Eingabeelemente meines Flex-Containers nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!