| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| div { |
| text-align: justify; |
| } |
| |
| .inlineBlock { |
| display: inline-block; |
| } |
| |
| span { |
| display: block; |
| } |
| |
| div:after { |
| content: ''; |
| display: inline-block; |
| width: 100%; |
| } |
| |
| </style> |
| <script src="../../resources/js-test-pre.js"></script> |
| <script> |
| description('This test ensures that we properly reattach collapsed whitespace when sibling style changes require. Test passes if the spans below are justified across the page.'); |
| onload = function() { |
| spans = document.getElementsByTagName("span"); |
| for (var i = spans.length - 1; i >= 0; i--) |
| spans[i].classList.add('inlineBlock'); |
| var container = document.getElementById('container'); |
| shouldBeGreaterThanOrEqual('spans[spans.length - 1].offsetLeft', "container.offsetWidth * 2 / 3"); |
| container.style.display = 'none'; |
| } |
| </script> |
| </head> |
| <body> |
| <div id="container"> |
| <span>Item 1</span> |
| <span>Item 2</span> |
| <span>Item 3</span> |
| </div> |
| </body> |
| </html> |