Grid Items Layout
Customizing
Layout
0
40
0
40
Content
Preview
Layout mode
11111
22222
33333
44444
Code
Paste to your file(s)
CSS
.grid {
display: grid;
grid-template-columns: 1fr 1fr;
justify-items: stretch;
align-items: stretch;
column-gap: 20px;
row-gap: 20px;
}
.content {
color: #242424;
background-color: #f25fff;
font-weight: 600;
text-align: center;
box-sizing: border-box;
height: 100%;
padding: 10px;
}
HTML
<div class="grid">
<div class="item">
<div class="content">
<p>11111</p>
</div>
</div>
<div class="item">
<div class="content">
<p>22222</p>
</div>
</div>
<div class="item">
<div class="content">
<p>33333</p>
</div>
</div>
<div class="item">
<div class="content">
<p>44444</p>
</div>
</div>
</div>