Add a rule between CSS grid columns and rows

Question

Is there a css grid property to add a rule (vertical line) between grid columns, and a rule (horizontal line) between grid rows, in the same way, or similar, that column-rul

Answer 1

As @Paulie_D said, no there isn't. You would have to do something as hideous as this to get something even close it it - you can't even use grid-gap if you do this:

#grid{
  display: inline-grid;
  grid-template-rows: auto 2px auto 2px auto;
  grid-template-columns: auto 2px auto 2px auto;
}
.item{
  width: 5rem;
  height: 5rem;
  background: red; 
}
.rule{
  background:black;
}