I currently render my grid line using pure css, click this link for my codesandbox. But this is not accurate as this grid is being render in pixels, not grid unit.

my css

.container {
  background-color: red;
  width: 1000px;
  height: 3000px;
  background-image: repeating-linear-gradient(#ccc 0 1px, transparent 1px 100%),
    repeating-linear-gradient(90deg, #ccc 0 1px, transparent 1px 100%);
  background-size: 50px 50px;
}

.react-grid-layout {
  background: none !important;
}

Is there any way to render the grid line so when my grid item is being render, it will reflect accurately.

For example, if i define w:2, h:4, x:0, y:0 my grid item will fit nicely.

Below image shows that I have import my style.css