Kevin Powell - CommunityKP-C
Kevin Powell - Community•2y ago•
11 replies
Rianẍa

Grid system

Anyone know if this is possible?

I want to make a grid system. Now it is not possible to get them right. Photo 1 is what it currently looks like, but it. should be like photo 2.

So everything should fit together

This is my css
 .grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 6px;
    overflow: hidden;
}
.grid .col-grid-6 { 
    grid-column: span 6;
    height: max-content;
}

This is my html
<div class="grid">
  <div class="col-grid-6 col-grid-lg-4">
    <div class="card">
      <div class="card-body">
      <-- rest of code -->
      </div>
    </div>
  </div>
<div class="col-grid-6 col-grid-lg-4">
    <div class="card">
      <div class="card-body">
      <-- rest of code -->
      </div>
    </div>
  </div>
<div class="col-grid-6 col-grid-lg-4">
    <div class="card">
      <div class="card-body">
      <-- rest of code -->
      </div>
    </div>
  </div>
<div class="col-grid-6 col-grid-lg-4">
    <div class="card">
      <div class="card-body">
      <-- rest of code -->
      </div>
    </div>
  </div>
</div>


Hopefully someone can help me?
file-9P8xhy6AZSO0XyeHBzeHDjUs.png
file-jrlcMDt3xizi4oRMVNY0VAHQ.png
Was this page helpful?