Почему вычисленная высота DIV больше, чем его содержимое (например, svg), если его высота указана как «100%»? [Дубликат]

На этот вопрос уже есть ответ здесь:

Изображение внутри div имеет дополнительное пространство под изображением 9 ответов

Вот мой код:

<!DOCTYPE html>
<html>

<body>
  <div align="center" style="width:100%; height:100%; padding: 0px; margin: 0px;">
    <svg height="500" version="1.1" width="1000" xmlns="http://www.w3.org/2000/svg" id="raphael-paper-0" style="overflow: hidden; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; cursor: default; position: relative; background-color: rgb(255, 255, 255);">
      <circle cx="500" cy="250" r="100" stroke="green" stroke-width="4" fill="yellow" />
    </svg>
  </div>
</body>

</html>

Я получаю вычисленное измерение SVG как 1000 X 500, но вычисленное измерение DIV составляет 1264 X 504.

Ширина DIV - 1264px - это ширина страницы, так как она указана как 100%, то есть понятна, но почему высота равна 504px, тогда как высота SVG равна 500px?

Заранее спасибо.

Ответы на вопрос(1)

Ваш ответ на вопрос