inline-block-sibling-2-dyn.html 784 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. <!DOCTYPE html>
  2. <html class="reftest-wait">
  3. <head>
  4. <style type="text/css">
  5. div {
  6. height: 20px; width: 100%;
  7. background-color: blue;
  8. vertical-align: bottom;
  9. }
  10. #block1 {
  11. margin-bottom: 15px;
  12. }
  13. #inline-block1 {
  14. margin: 25px 0 25px;
  15. }
  16. #inline-block2 {
  17. margin: 15px 0 15px;
  18. }
  19. #block2 {
  20. margin-top: 25px;
  21. }
  22. </style>
  23. <script type="text/javascript">
  24. function test() {
  25. document.getElementById('inline-block1').style.display = 'inline-block';
  26. document.getElementById('inline-block2').style.display = 'inline-block';
  27. document.documentElement.removeAttribute('class');
  28. }
  29. document.addEventListener('MozReftestInvalidate', test, false);
  30. </script>
  31. </head>
  32. <body>
  33. <div id="block1"></div>
  34. <div id="inline-block1"></div>
  35. <div id="inline-block2"></div>
  36. <div id="block2"></div>
  37. </body>
  38. </html>