Q:

CSS grid item positioning inside div

I'm working with this part of code:
<div class="row">
  <h2>Row title</h2>
  <span class="test">table cell</span>
  <span>table cell</span>
</div>
<div class="row">
  <h2>Row title</h2>
  <span>table cell</span>
  <span>table cell</span>
</div>
<div class="row">
  <h2>Row title</h2>
  <span>table cell</span>
  <span>table cell</span>
</div>

My question is if I do:
.row {
    grid-column: span 3;
}

Is it possible to place items inside this spanned cells like this without flexbox on <div>?

A:

No not with just that,
.row {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-gap: 10px;
    background-color: #2196F3;
    padding: 10px;
 }

this will give you the required behaviour. You may have to add extra styling to this.
Check -> https://www.w3schools.com/cssref/pr_grid-column.asp for reference.

also the grid-column property is mostly used to style an individual item. That too in combination with display: grid property on the wrapping element

