flexbox-abspos-container-2.html 827 B

1234567891011121314151617181920212223242526272829303132
  1. <!-- Any copyright is dedicated to the Public Domain.
  2. http://creativecommons.org/publicdomain/zero/1.0/ -->
  3. <!-- This testcase has a relatively-positioned -moz-box element, which should
  4. form a containing block for its absolutely positioned child. Also: in
  5. this case, the child is taller than its container. -->
  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. top: 10px;
  20. width: 20px;
  21. height: 150px;
  22. background: purple;
  23. }
  24. </style>
  25. </head>
  26. <body>
  27. <div class="box relpos_parent">
  28. <div class="abspos_child"></div>
  29. </div>
  30. </body>
  31. </html>