3 <p>Test if child blocks are correctly laid out when padding/border of the box-sizing:border-box parent is updated.
</p>
5 <div id=
"target1" style=
"width:100px; box-sizing:border-box; border:0 solid;">
6 <div data-expected-width=
"50">The quick brown fox jumps over the lazy dog.
</div>
8 <div id=
"target2" style=
"width:100px; box-sizing:border-box;">
9 <div data-expected-width=
"50">The quick brown fox jumps over the lazy dog.
</div>
11 <div id=
"target3" style=
"width:100px; box-sizing:border-box;">
12 <div data-expected-width=
"50">The quick brown fox jumps over the lazy dog.
</div>
14 <script src=
"../../resources/check-layout.js"></script>
16 document
.body
.offsetLeft
;
17 document
.getElementById('target1').style
.borderLeftWidth
= '50px';
18 document
.getElementById('target2').style
.paddingLeft
= '50px';
19 document
.getElementById('target3').setAttribute('style', 'width:50px; box-sizing:content-box; border-left:50px solid;');
20 checkLayout('#target1');
21 checkLayout('#target2');
22 checkLayout('#target3');