flexbox-abspos-container-1c.html 832 B

12345678910111213141516171819202122232425262728293031323334
  1. <!-- Any copyright is dedicated to the Public Domain.
  2. http://creativecommons.org/publicdomain/zero/1.0/ -->
  3. <!-- This testcase is the same as the -1a version, but with an additional
  4. -moz-box wrapper, so that our relatively positioned box will never get a
  5. call to Reflow. -->
  6. <html>
  7. <head>
  8. <style>
  9. .box { display: -moz-box }
  10. .relpos_parent {
  11. position: relative;
  12. width: 100px;
  13. height: 100px;
  14. background: lightblue;
  15. }
  16. .abspos_child {
  17. position: absolute;
  18. left: 30px;
  19. bottom: 10px;
  20. width: 20px;
  21. height: 20px;
  22. background: purple;
  23. }
  24. </style>
  25. </head>
  26. <body>
  27. <div class="box">
  28. <div class="box relpos_parent">
  29. <div class="abspos_child"></div>
  30. </div>
  31. </div>
  32. </body>
  33. </html>