getBoundingClientRect，内联SVG的高度值不正确

Question

<body style="width:1000px;height:1000px;">
    <div id="d" style="display:inline-block;">
        <svg id="s" xmlns="http://www.w3.org/2000/svg" version="1.1" width="200px" height="200px">
          <rect width="200px" height="200px" style="fill:rgb(0,0,255);"/>
        </svg>
    </div>
</body>

var div = document.getElementById('d');
var rect = div.getBoundingClientRect();

alert(rect.width);  //200
alert(rect.height);  //205 (in safari), 204.5 in other browsers

var svg = document.getElementById('s');
var rect = svg.getBBox();

alert(rect.width);  //200
alert(rect.height);  //200

I'm trying to get the width and height of the parent div. 我想要获得父div的宽度和高度。 For whatever reason, getBoudingClientRect is giving me an incorrect height value (205 or 204.5) The width is correct, but the height is off. 无论出于何种原因，getBoudingClientRect给我一个不正确的高度值（205或204.5）宽度是正确的，但高度是关闭的。 Any ideas? 有任何想法吗？

http://jsfiddle.net/jTvaF/5/ http://jsfiddle.net/jTvaF/5/

Answer 1

Give the svg the property of display:block; 给svg提供display：block; and it should start outputting correctly. 它应该开始正确输出。

getBoundingClientRect，内联SVG的高度值不正确

问题描述

1 个解决方案

解决方案1
4 已采纳 2013-11-07 00:15:46

getBoundingClientRect，内联SVG的高度值不正确

问题描述

1 个解决方案

解决方案1 4 已采纳 2013-11-07 00:15:46

解决方案1
4 已采纳 2013-11-07 00:15:46