CSS grid-row-end eigenschap

Definitie en gebruik

De grid-row-end-eigenschap bepaalt hoeveel rijen het item overspant, of op welke rijlijn het item eindeert.

Zie de voorbeelden aan het einde van de pagina.

Zie ook:

CSS-tutorial:CSS grid-layout

Voorbeeld

Voorbeeld 1

Maak "item1" drie rijen breed:

.item1 {
  grid-row-end: span 3;
}

Probeer het zelf uit

Voorbeeld 2

U kunt de waarde van de rijlijn gebruiken in plaats van het aantal rijen dat het item overspant:

.item1 {
  grid-row-end: 3;
}

Probeer het zelf uit

CSS-syntaxis

grid-row-end: auto|row-line|span n;

Eigenschapswaarde

Waarde Beschrijving
auto Standaardwaarde. Het item overspant één rij.
span n Bepaalt het aantal rijen dat het item horizontaal overspant.
column-line Bepaalt op welke rij het weergeven van het item eindeert.

Technische details

Standaardwaarde: auto
Inheritance: Nee
Animatiegemaakt: Ondersteund. Raadpleeg:Animatiegerelateerde eigenschappen.
Versie: CSS Grid Layout Module Level 1
JavaScript-syntaxis: object.style.gridRowEnd="4"

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die deze eigenschap volledig ondersteunt.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44