@red-rosefields, @droidgoo’s description of what’s going on is correct:
Adding rows or columns to the grid definition doesn’t change the placement of elements in the grid - unless you are using named grid areas.
For example, let’s say you have a grid with one row and one column, and one element displayed in position (1,1). Adding a new row at the beginning of the grid will change the grid definition, but it will not change the position of the element - it will still be displayed at (1,1).
This separation of grid layout and element positioning is a feature of CSS Grid, not a bug because it lets us create responsive grid layouts where position of element is defined, but the actual shape of the grid adjusts to different situations.
So, CSS Grid is not like HTML table where layout of the table and cell positions / order is one and the same thing.
Using named grid areas / lines
CSS Grid lets us name areas and lines of the grid. If we use these names to position elements, inserting rows and columns also changes the position of named areas and lines accordingly.
For example, if area (1,1) would be named “title” and the element would be positioned using this named area, inserting a new row at the beginning would push the “title” down one row and the element would thus be displayed in the 2nd row of the grid.