Atrybut CSS grid-column-end

Definicja i użycie

Atrybut grid-column-end określa, ile kolumn element będzie przechodził, lub na której linii kolumnowej (column-line) zakończy się.

Zobacz przykłady na końcu strony.

Inne źródła:

Kurs CSS:Układ siatki CSS

Przykład

Przykład 1

Umożliwia "item1" przechodzenie przez trzy kolumny:

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

Spróbuj sam

Przykład 2

Możesz użyć wartości kolumny linii zamiast liczby kolumn, które element ma przechodzić.

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

Spróbuj sam

Język CSS

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

Wartość atrybutu

Wartość Opis
auto Domyślna wartość. Element będzie przechodził przez jedną kolumnę.
span n Określa liczbę kolumn, które element będzie przechodził.
column-line Określa, w którym kolumnie zakończyć wyświetlanie elementu.

Szczegółowe informacje techniczne

Domyślna wartość: auto
Inherencja: Nie
Tworzenie animacji: Obsługiwane. Zobacz:Atrybuty animacji.
Wersja: Moduł układu siatki CSS Grid Level 1
Język JavaScript: object.style.gridColumnEnd="5"

Obsługa przeglądarki

Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.

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