third_party/WebKit/LayoutTests/fast/repaint/box-sizing.html

   1 <!DOCTYPE HTML>
   2 <script src="resources/text-based-repaint.js"></script>
   3 <script>
   4 function repaintTest()
   5 {
   6     document.getElementById('target1').className = 'content-box';
   7     document.getElementById('target2').className = 'border-box';
   8 }
   9 window.onload = runRepaintTest;
  10 </script>
  11 <style>
  12 body {
  13     margin: 0;
  14 }
  15 div {
  16     width: 50%;
  17     height: 100px;
  18     position: absolute;
  19     background-color: green;
  20     border: blue solid 20px;
  21 }
  22 .border-box {
  23     box-sizing: border-box;
  24 }
  25 .content-box {
  26     box-sizing: content-box;
  27 }
  28 </style>
  29 <div id="target1" class="border-box" style="top: 0px"></div>
  30 <div id="target2" class="content-box" style="top: 200px"></div>