Display grid equal width two columns

by Vishnuprasad ps

HTML

<div class="grid">
  <div class="item">Column 1<br /><br /></div>
  <div class="item">Column 2<br /><br /></div>
</div>

CSS

.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 1rem;
  background: red;
  padding: 1rem;
}

.item {
  background: white;
}