flexbox-dyn-changePadding-1b.xhtml 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!--
  3. Any copyright is dedicated to the Public Domain.
  4. http://creativecommons.org/publicdomain/zero/1.0/
  5. -->
  6. <!--
  7. This test checks that we reflow sufficiently when a stretched, nested
  8. flex container needs an incremental reflow. This test should end up
  9. rendering as a lime square, 100px by 100px.
  10. -->
  11. <html xmlns="http://www.w3.org/1999/xhtml"
  12. class="reftest-wait">
  13. <head>
  14. <style>
  15. #outerContainer {
  16. display: flex;
  17. width: 100px;
  18. height: 100px;
  19. background: red;
  20. }
  21. #tweakMe {
  22. display: flex;
  23. background: orange;
  24. width: 100px;
  25. /* height should stretch to fill parent's height, via
  26. * parent's "align-items: stretch" (the default) */
  27. padding-left: 1px;
  28. }
  29. </style>
  30. <script>
  31. function tweak() {
  32. var tweakMe = document.getElementById("tweakMe");
  33. tweakMe.style.paddingLeft = "0";
  34. tweakMe.style.background = "lime";
  35. document.documentElement.removeAttribute("class");
  36. }
  37. window.addEventListener("MozReftestInvalidate", tweak, false);
  38. </script>
  39. </head>
  40. <body>
  41. <div id="outerContainer">
  42. <div id="tweakMe"></div>
  43. </div>
  44. </body>
  45. </html>