Что заставляет pre быть выше, чем код в reve.js?

Question

Я создаю слайды с помощьюкартируйн.js, но по какой-то причине pre блоки занимают больше высоты, чем должны.В примерах снимков экрана блок pre выше блока code примерно на 90 пикселей.

Но CSS, похоже, не указывает, почему.pre не имеет определенной высоты, а code не имеет такого количества отступов, поэтому я не понимаю, почему он занимает так много места.

Почему высота preнамного выше, чем code?Почему pre не просто переносит code и соответствует его высоте?

<section>
  <h3>Property: Font-size</h3>
  <p>The font-size property specifies the size of the font.</p>
  <pre>
    <code data-trim>
      p {
        font-size: 12px;
        font-size: 1.5em;
        font-size: 100%;
      }
    
  

Пиксели

"em"

Процент

pre выделенный блок - css слева, модель коробки справа

code выделенный блок - css слева, модель коробки справа