Prevent padding from making an element bigger?

by

When you use the border-box model, the padding is included in the box size. See here for details.

.seventy {
  float: left;
  width: 70%;
  background-color: lightsalmon;
}

.thirty {
  box-sizing: border-box;
  padding: 25px;
  float: left;
  width: 30%;
  background-color: lightgreen;
}
<div class="seventy">70% wide</div>
<div class="thirty">30% wide</div>

Leave a Comment