Chapter 2: Seven Ways You Can Place Elements Using CSS Grid Layout
by Nitish Kumar
In this chapter, the focus will be on specific ways in which you can lay out elements on the web using CSS Grid. Now, let's go over each one of them.
#1 Specifying Everything in Individual Properties
This is the version we have been using to place the elements in our previous articles. This method is verbose but easy to understand. Basically, the left/right and top/bottom bounds of an element are specified using gridcolumn-start
/gridcolumn-end
and gridrow-start
/gridrow-end
properties. If an element is only going to span one row or column, you can omit the -end ...
Get Designing with CSS Grid Layout now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.