Core Code
Core Code Modern Dev Handbook

Card Component Example

border-box keeps card components predictable.

Preview

Code

<style>
.card{
width:200px;
padding:20px;
border:2px solid #2563eb;
box-sizing:border-box;
background:white;
}
</style>

<div class="card">
Card component
</div>

More CSS Box Sizing Examples (8)

example Content Box Model open example example Border Box Model open example example Box Sizing Comparison open example example Global Border Box open example example Layout With Border Box open example example Form Input Box Sizing open example example Grid Layout Example open example example Box Sizing Reset Pattern open example