//sample code for giving border to the grid layout

​

//create grid

@media (min-width: 768px) {

 .service-grid {

   display: grid;

   grid-template-columns: repeat(auto-fill, minmax(300px, 1fr) ) ;

   grid-gap: 0px;

 }

}

//this is for eac elememnt of grid

.service-item {

 padding: 3rem;

 text-align: center;

 border-top: 1px solid #dfdfdf;

}

@media (min-width: 768px) {

 .service-item {

   border-top: 1px solid #dfdfdf;

   border-left: 1px solid #dfdfdf;

 }

}

​

//credits

/*For more Details

https://robleto.medium.com/how-to-set-internal-border-lines-on-a-css-grid-layout-f2f1eeaafb61 */