x
<html><head><style>.grid-container { display: grid; grid-template-columns: auto auto auto auto; gap: 10px; background-color: #2196F3; padding: 10px;}.grid-container > div { background-color: rgba(255, 255, 255, 0.8); border: 1px solid black; text-align: center; font-size: 30px;}</style></head><body><h1>Grid Container</h1><p>A Grid Container consists of grid items arranged in columns and rows</p><div class="grid-container"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>8</div></div><p>Direct child elements(s) of the grid container automatically becomes grid items.</p></body></html>