What is the final-column CSS Grid layout property and where is it documented?-CodePudding

I was trying to think of a way to make a grid item span all columns. As I was doing this GitHub copilot suggested final-column. It works in Chrome, but I can't find it documented anywhere... I even searched the Mozilla docs on it. for final-column but there aren't any results.

Example of usage:

.upload-image {
    width: 100%;
    grid-column-start: 1;
    grid-column-end: final-column;
}

CodePudding user response：

I don't think 'final-column' exists as a setting for grid-column-end.

In fact, if you put any old rubbish for that value you seem to get the image extending to the last column.

Try this snippet for example:

div {
  display: grid;
  grid-template-areas: 'A B C';
}

img {
  width: 100%;
  grid-column-start: 1;
  grid-column-end: rubbish;
}

<div><img src="https://picsum.photos/id/1015/300/200">
</div>