<div class="box block">
  width: 150px;
</div>
<div class="box wrapper">
  <div class="box child">
    width: 50%;
  </div>
  <p>Не забуваємо, що на ширину також впливають поля та межі!</p>
</div>
.box {
  border: 2px solid #666;
  padding: 12px;
  font-family: monospace;
  font-size: 18px;
}

.block {
  margin-bottom: 16px;
  line-height: 25px;
  width: 150px;
}

.wrapper {
  width: 250px;
}

.child {
  width: 50%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.