Por que a altura do DIV calculada é maior que o conteúdo (como svg) quando a altura é fornecida como "100%"? [duplicado]
Esta pergunta já tem uma resposta aqui:
A imagem dentro de div possui espaço extra abaixo da imagem 9 respostasAqui está o meu código:
<!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>
Eu recebo a dimensão calculada do SVG como 1000 X 500, mas a dimensão calculada do DIV é 1264 X 504.
A largura de DIV - 1264px é a largura da página, pois é fornecida como 100%, ou seja, entendida, mas por que a altura é 504px enquanto a altura SVG é 500px?
Desde já, obrigado.