4 ms·
`grid-row: -2` targets the bottom-most row, whereas I would have expected `grid-row: -1` to do so. I've never seen `-2` used to refer to the last element in a s
by pc2g4d 10y ago
`grid-row: -2` targets the bottom-most row, whereas I would have expected `grid-row: -1` to do so. I've never seen `-2` used to refer to the last element in a sequence. Python [1,2,3][-1] yields 3, for example.
Anybody have an explanation for this surprising behavior?
- zerocrates 10y agoThe logic goes like this: everything is 1-indexed, including the negative numbers (zero is just illegal). 1 means "the first grid line" aka the top edge of the grid , and -1 means "the last grid line" aka the bottom edge of the grid. grid-row is a shorthand property, and giving just one number is equivalent to specifying it as grid-row-start, so your declaration is the equivalent of grid-row-start: -2 Specifying a negative counts from "the other side," but it doesn't change how the automatic span/end is calculated. It's still 1 grid-line "further" by default. This is why you need to use -2: with -1 you're saying: occupy one row starting from the far bottom edgeline of the grid, going down (meaning the first row outside the grid). To get the last row, you want to say "start at one grid line from the bottom and go one line down," meaning you want grid-row-start: -2, or in shorthand grid-row: -2.