<!DOCTYPE html>
<html>
<head>
<style>
div.ex1 {
width: 300px;
background-color: yellow;
}

div.ex2 {
width: 120px;
padding: 8px;
box-sizing: border-box;
background-color: lightblue;
}
</style>
</head>
<body>

<h2></h2>

<div class="ex1"></div>
<br>

<div class="ex2">The width of this div remains at 300px, in spite of the 50px of total left and right padding, because of the box-sizing: border-box property.
</div>

</body>
</html>
العودة إلى الأعلى