<div class="heredado">Y, diciendo esto, dio de espuelas a su caballo <code>Rocinante</code>, sin atender a las voces que su escudero <code>Sancho</code> le daba, advirtiéndole que, sin duda alguna, eran molinos de viento, y no gigantes, aquellos que iba a acometer.</div>
<div class="declarado">Y, diciendo esto, dio de espuelas a su caballo <code>Rocinante</code>, sin atender a las voces que su escudero <code>Sancho</code> le daba, advirtiéndole que, sin duda alguna, eran molinos de viento, y no gigantes, aquellos que iba a acometer.</div>
body {
  font-size: 16px;
  margin: 16px;
  background-color: #F8ECC2;
}

.heredado, .declarado {
  font-size: 1.25em; /* Valor computado: 20px (16px * 1,25) */
  width: 45%;
}

.heredado code {
  /* font-size hereda implícitamente 20px, no 1.25em */
}

.declarado code {
  font-size: 1.25em; /* Heredando 1.25em, tendría 25px */
}

code {
  background-color: lightgray;
}

.heredado {
  float: left;
}

.declarado {
  float: right;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.