6

When using a range object to getBoundingClientRect in IE11 it reports wrong numbers. It reports the height as 128 while the actual height is 74. It reports the top offset as 8 while the actual top offset is 35.

Is this a known bug? Is there a way to get accurate numbers for a selection in windows ie11.

var div = document.querySelectorAll('div')[0];
var t = div.childNodes[0];
var range = document.createRange();
range.setStart(t, 0)
range.setEnd(t, 1)

console.log(range.getBoundingClientRect())
div.text {
  font-size: 64px;
  line-height: 1em;
}
<div class="text">T</div>

Here is a screenshot for reference:

enter image description here

StefanHayden
  • 3,569
  • 1
  • 31
  • 38

1 Answers1

2

EDIT:

For me, Win 7 64bit IE11.0.9600, running your snippet the console says:

[object ClientRect]{bottom: 72, constructor: ClientRect {...}, height: 64, left: 8, right: 47.090000152...", top: 8, width: 39.090000152..."}

Which roughly matches FF 47.0.1 values:

DOMRect { x: 8, y: 3.3333282470703125, width: 38.5, height: 73.33334350585938, top: 3.3333282470703125, right: 46.5, bottom: 76.66667175292969, left: 8 }
K Scandrett
  • 16,390
  • 4
  • 40
  • 65
  • I'm annoyed that when I posted this the numbers I got were so drastically different to what I get now in the same windows virtual environment. I'm not sure what changed but what I see now matches what you see as well. – StefanHayden Oct 21 '16 at 17:52