grid-row-end
Anonymous contributor
Published Jul 16, 2021Updated Sep 3, 2021
Contribute to Docs
Specifies the end of a content span over a set of rows within a grid framework.
Syntax
The grid is a combination of horizontal and vertical lines that frame the rows and columns, which are the spaces between the lines. The top left corner of a grid is defined by a vertical and horizontal line, each designated the value 1. The right side of the first column and the underside of the first row are defined by lines with the value 2, and so on through value n.
.some-text {grid-row-end: <grid-value>;}
where <grid-value>
can be one of the following:
- Grid keyword:
auto
- Grid line value:
1
- Grid line name:
article-content-start
Example 1
Content that starts on the second row and spans four rows:
.foo-text {grid-row-start: 2;grid-row-end: 6;}
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn CSS on Codecademy
- Career path
Front-End Engineer
Front-end engineers work closely with designers to make websites beautiful, functional, and fast.Includes 34 CoursesWith Professional CertificationBeginner Friendly115 hours - Career path
Full-Stack Engineer
A full-stack engineer can get a project done from start to finish, back-end to front-end.Includes 51 CoursesWith Professional CertificationBeginner Friendly150 hours - Free course
Learn CSS
In this CSS tutorial, you’ll learn how to add CSS to visually transform HTML into eye-catching sites.Beginner Friendly6 hours