Sie haben möglicherweise bemerkt, dass bei der Verwendung von minmax() zum Festlegen der Höhe oder Breite von Rasterzeilen oder -spalten das Standardverhalten vorliegt besteht darin, dass sich die Spur auf ihre maximale Größe ausdehnt, anstatt auf ihrer minimalen Größe zu bleiben. Dies kann verwirrend sein, insbesondere wenn Sie erwarten, dass die Spur entsprechend dem min()-Wert in minmax() auf der kleinstmöglichen Größe bleibt.
Der Grund dafür Dieses Verhalten ist auf den standardmäßigen Skalierungsmodus von Spuren in einem Rasterlayout zurückzuführen. Gemäß der CSS-Spezifikation werden Spuren normalerweise so groß, dass sie den verfügbaren Platz ausfüllen, bis sie ihre maximale Größe erreichen. Wenn der verfügbare Platz größer ist als die gesamte Mindestgröße aller Spuren, wird der verbleibende Platz gleichmäßig auf die unbegrenzten Spuren (diejenigen ohne definierte Maximalgröße) verteilt.
Dieses Standardverhalten ist normalerweise erwünscht, da es dafür sorgt dass Spuren den verfügbaren Platz effizient belegen.
Damit Rasterzeilen oder -spalten auf ihrer Mindestgröße bleiben, sich aber auf ihre Maximalgröße erweitern, wenn mehr Inhalt vorhanden ist hinzugefügt, können Sie eine Kombination aus minmax() und anderen CSS-Eigenschaften verwenden:
Beispiel:
1 2 3 4 5 6 7 8 9 |
|
In diesem Beispiel haben die Rasterspalten immer eine Mindestbreite von 100 Pixeln, werden aber nicht über diese Größe hinaus erweitert. Wenn den Rasterelementen mehr Inhalt hinzugefügt wird, werden die Spalten erweitert, um den neuen Inhalt aufzunehmen, überschreiten jedoch nicht ihre maximale Breite.
Das obige ist der detaillierte Inhalt vonWarum ist „minmax()' im CSS-Grid standardmäßig „max' anstelle von „min'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!