slice-nowrap-intrinsic-size-bidi.html (2761B)
1 <!DOCTYPE html> 2 <head> 3 <title>CSS Test: min/max-content size on box-decoration-break:slice inline box with bidi text and white-space:nowrap</title> 4 <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> 5 <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-min-content"> 6 <link rel="help" href="https://drafts.csswg.org/css-break-3/#break-decoration"> 7 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1556709"> 8 <link rel="match" href="slice-nowrap-intrinsic-size-bidi-ref.html"> 9 <style> 10 html,body { 11 color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0; 12 } 13 14 div { 15 border: 5px solid blue; 16 white-space: nowrap; 17 } 18 .max > div { 19 width: max-content; 20 } 21 .min > div { 22 width: min-content; 23 } 24 25 span { 26 border: 2px solid gray; 27 padding: 0 10px 0 6px; 28 border-width: 0 8px 0 5px; 29 margin: 0 4px 0 3px; 30 background: yellow; 31 } 32 33 f { margin-right: 30px; float: left; } 34 </style> 35 <body> 36 <f class="max"> 37 <div> 38 <span>‮a‭bc</span><span>d‮e‭f</span> 39 </div> 40 <div> 41 <span>‮a‭bc</span>aa<span>d‮e‭f</span> 42 </div> 43 <div> 44 <span>‮a‭bc</span> <span>d‮e‭f</span> 45 </div> 46 <div> 47 <span>‮a‭bc </span><span>d‮e‭f</span> 48 </div> 49 <div> 50 <span>‮a‭bc</span><span> d‮e‭f</span> 51 </div> 52 <div> 53 <span>‮a‭bc</span> aa<span>d‮e‭f</span> 54 </div> 55 <div> 56 <span>‮a‭bc </span>aa<span>d‮e‭f</span> 57 </div> 58 <div> 59 <span>‮a‭bc</span>aa<span> d‮e‭f</span> 60 </div> 61 <div> 62 <span>‮a‭bc</span> aa <span>d‮e‭f</span> 63 </div> 64 <div> 65 <span>‮a‭bc</span>aa <span>d‮e‭f</span> 66 </div> 67 <div> 68 <span>‮a‭bc</span>aa </div> 69 </f> 70 71 <f class="min"> 72 <div> 73 <span>‮a‭bc</span><span>d‮e‭f</span> 74 </div> 75 <div> 76 <span>‮a‭bc</span>aa<span>d‮e‭f</span> 77 </div> 78 <div> 79 <span>‮a‭bc</span> <span>d‮e‭f</span> 80 </div> 81 <div> 82 <span>‮a‭bc </span><span>d‮e‭f</span> 83 </div> 84 <div> 85 <span>‮a‭bc</span><span> d‮e‭f</span> 86 </div> 87 <div> 88 <span>‮a‭bc</span> aa<span>d‮e‭f</span> 89 </div> 90 <div> 91 <span>‮a‭bc </span>aa<span>d‮e‭f</span> 92 </div> 93 <div> 94 <span>‮a‭bc</span>aa<span> d‮e‭f</span> 95 </div> 96 <div> 97 <span>‮a‭bc</span> aa <span>d‮e‭f</span> 98 </div> 99 <div> 100 <span>‮a‭bc</span>aa <span>d‮e‭f</span> 101 </div> 102 <div> 103 <span>‮a‭bc</span>aa </div> 104 </f>