-
-
Notifications
You must be signed in to change notification settings - Fork 3.6k
getBoundingClientRect ignores some block boxes of inline parent #41275
Copy link
Copy link
Closed as duplicate of#39495
Closed as duplicate of#39495
Copy link
Description
Describe the bug:
getBoundingClientRect for an inline element parent only considers block boxes children if they are "wrapped" by 2 inline boxes before andd after.
To Reproduce:
<!DOCTYPE html>
<style>
.test-class {
display: inline;
font-size: 10px;
}
.inline {
display: inline;
background: burlywood;
}
.block {
width: 50px;
height: 50px;
background: blanchedalmond;
}
</style>
<body>
<div>
<div class="test-class">
<div class="block">block</div>
<div class="inline">inline</div>
<div class="block">block</div>
<div class="inline">inline</div>
<div class="block">block</div>
</div>
</div>
</body>
<script>
const el = document.querySelector('div.test-class');
console.log('Size:', el.getBoundingClientRect().width, 'x', el.getBoundingClientRect().height);
console.log('Computed display:', getComputedStyle(el).display);
console.log('Computed size:', getComputedStyle(el).width, 'x', getComputedStyle(el).height);
</script>
In Servo (only the 2nd block dive is considered)

May modify the list of children to see more
Reactions are currently unavailable
