<div class="card-grid">
<article class="card">
<h3>Standard Plan</h3>
<p>Perfect for starters.</p>
<button>Join</button>
</article>
<article class="card">
<h3>Professional Plan with Priority Support</h3>
<p>For growing businesses that need more resources and dedicated time from our experts.</p>
<button>Join</button>
</article>
<article class="card">
<h3>Enterprise</h3>
<p>Full access.</p>
<button>Join</button>
</article>
</div>
Back to Snippets
CSS Subgrid Card Alignment
Solve the common problem of misaligned card content with CSS Subgrid. This layout ensures that headers, bodies, and footers line up perfectly across the row, regardless of the amount of text in each card.
347