CSS/Funktionen/fit-content()

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die fit-content()-Funktion definiert einen Größenbereich, der dem vorhandenen Inhalt entspricht. Sie erweitert das in den intrinsischen Abmessungen vorhandene Schlüsselwort fit-content um einen Maximalwert.

Parameter

Syntax

fit-content( <Längenangabe> <Prozentangabe> )

Die fit-content()-Funktion passt (clamps) eine gegebene Größe an die verfügbare Größe nach der Formel

min(maximum size, max(minimum size, argument)).

Die Funktion kann als Größenangabe in den Grid-Eigenschaften verwendet werden, in dem die maixmale Größe durch max-content und die Mindestgröße durch auto (d. h. minmax(auto, max-content)) festgelegt ist. Besonders ist, dass die track size clamped at argument ist, wenn sie größer als das auto-Minimun ist.

anwendbar auf Die Funktion wird in den CSS Grid Eigenschaften grid-auto-columns, grid-auto-rows, grid-template-columns und grid-template-rows verwendet.

Für die Zukunft ist eine Verwendung in width, height, min-width, min-height, max-width und max-height geplant.[1]

Browsersupport caniuse: mdn-css_properties_grid-template-rows_fit-content
Beispiel
grid-template-columns: fit-content(8ch) fit-content(8ch) 1fr;
 


Weblinks

  1. Caniuse: property: width: fit-content()

Siehe auch