overflow-wrap-anywhere-008.html (1555B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Text Test: overflow-wrap - anywhere and white-space - nowrap</title> 4 <link rel="author" title="Intel" href="http://www.intel.com"> 5 <link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com"> 6 <link rel="help" title="3 White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> 7 <link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-nowrap"> 8 <link rel="help" title="5.5. Overflow Wrapping: the overflow-wrap/word-wrap property " href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property"> 9 <link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere"> 10 <link rel="match" href="overflow-wrap-002-ref.html"> 11 <meta name="flags" content="ahem"> 12 <meta name="assert" content="Test checks that the 'overflow-wrap' property has effect if and only if the 'white-space' allows wrapping"> 13 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 14 <style> 15 #ref { 16 border: 5px solid orange; 17 font: 20px/1 Ahem; 18 overflow-wrap: anywhere; 19 width: 200px; 20 } 21 #test { 22 border: 5px solid blue; 23 font: 20px/1 Ahem; 24 overflow-wrap: anywhere; 25 white-space: nowrap; 26 width: 200px; 27 } 28 </style> 29 <body> 30 <p class="instructions">Test passes if the black box overflows the blue border box, but fits within the orange border box.</p> 31 <p id="ref">FillerTextFillerTextFillerTextFillerText</p> 32 <p id="test">FillerTextFillerTextFillerTextFillerText</p> 33 </body>