Atributo CSS grid-row-end

Definição e uso

A propriedade grid-row-end define quantas linhas o item cobrirá ou na qual linha o item terminará.

Veja os exemplos no final da página.

Veja também:

Tutorial CSS:Layout de grade CSS

Exemplo

Exemplo 1

Faz "item1" cobrir três linhas:

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

Experimente você mesmo

Exemplo 2

Você pode usar o valor da linha para substituir o número de linhas a serem cobertas:

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

Experimente você mesmo

Sintaxe do CSS

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

Valor da propriedade

Valor Descrição
auto Valor padrão. O item cobrirá uma linha.
span n Define o número de linhas que o item cobrirá horizontalmente.
column-line Define a linha de início da exibição do item.

Detalhes técnicos

Valor padrão: auto
Herança: Não
Produção de animação: Suporte. Veja:Propriedades relacionadas a animação.
Versão: Módulo de Layout de Grade CSS Nível 1
Sintaxe do JavaScript: object.style.gridRowEnd="4"

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

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