Box Model Card
Content, padding, border aur margin ka clear card example dekho.
Working code
<div class="card">Box Model</div>
<style>
.card {
width: 220px;
padding: 24px;
border: 4px solid #0b73ce;
margin: 20px;
box-sizing: border-box;
background: white;
}
</style>Preview
Box Model
How it works
CSS box model me content ke around padding, phir border, aur uske bahar margin hota hai.
box-sizing: border-box declared width me padding aur border ko include karta hai.
Try Yourself
<div class="card">Box Model</div>
<style>
.card {
width: 280px;
padding: 32px;
border: 6px solid #333;
margin: 24px;
box-sizing: border-box;
}
</style>