| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>CSS Test: 'overflow-wrap' property is identical to 'text-wrap' property.</title> |
| <link rel="author" title="Mikhail Pozdnyakov" href="mailto:mikhail.pozdnyakov@intel.com" /> |
| <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-text-20120814/#overflow-wrap" /> |
| <script type="text/javascript"> |
| function test() |
| { |
| var propertyName = "overflow-wrap"; |
| |
| var value = window.getComputedStyle(document.getElementById("default"), null).getPropertyValue(propertyName); |
| var text = "Wrapping is : " + value + ".\n"; |
| |
| document.getElementById("default-value").textContent = text; |
| |
| value = window.getComputedStyle(document.getElementById("break-word"), null).getPropertyValue(propertyName); |
| text = "Wrapping is : " + value + ".\n"; |
| |
| document.getElementById("break-word-value").textContent = text; |
| } |
| </script> |
| </head> |
| <body onload="test()"> |
| <div id="default" style="border:2px solid blue;width:150px;">Longlonglonglonglonglonglonglonglongword</div> |
| <p id="default-value" style="white-space: pre"></p> |
| <div id="break-word" style="border:2px solid blue;width:150px;overflow-wrap:break-word"> |
| Longlonglonglonglonglonglonglonglongword |
| <p>Longlonglonglonglonglonglonglonglongword</p> |
| </div> |
| <p id="break-word-value" style="white-space: pre"></p> |
| </body> |
| </html> |
