Polecane kursy:

Funkcja CSS minmax()

Definicja i użycie CSS minmax() Funkcja używana w CSS do układu siatki, aby zdefiniować zakres rozmiaru, który jest większy lub równy minimalnej wartości i mniejszy lub równy maksymalnej wartości.

Przykład

Użyj minmax() Definiuj zakres rozmiaru kolumn siatki:

.grid-container {
  display: grid;
  grid-template-columns: minmax(min-content, 350px) minmax(150px, 1fr) 120px;
  grid-gap: 5px;
  height: 150px;
  background-color: green;
  padding: 10px;
}

Spróbuj sam

Gramatyka CSS

minmax(min, max)
Wartość Opis
min

Wymagane. Minimalna wartość.

Może być długością, procentem, wartością elastyczną (fr) lub jednym z poniższych słów kluczowych:

  • auto
  • max-content
  • min-content
max

Wymagane. Maksymalna wartość.

Może być długością, procentem, wartością elastyczną (fr) lub jednym z poniższych słów kluczowych:

  • auto
  • max-content
  • min-content

Szczegóły techniczne

Wersja: Moduł CSS Grid Layout Poziom 2

Wspierane przeglądarki

Tabela zawiera wersje przeglądarek, które w pełni wspierają tę funkcję.

Chrome Edge Firefox Safari Opera
59 16 52 10.1 44

Strony związane

Odniesienie:Funkcja min() w CSS

Odniesienie:Funkcja max() w CSS

Odniesienie:Atrybut CSS grid-template-columns

Odniesienie:Atrybut CSS grid-template-rows

Odniesienie:Atrybut grid-auto-columns w CSS

Odniesienie:Atrybut grid-auto-rows w CSS