slice-intrinsic-size-bidi.html (2843B)
1 <!DOCTYPE html> 2 <head> 3 <title>CSS Test: min/max-content size on box-decoration-break:slice inline box with bidi text</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=1552357"> 8 <link rel="match" href="slice-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 } 17 .max > div { 18 width: -moz-max-content; 19 width: -webkit-max-content; 20 width: max-content; 21 } 22 .min > div { 23 width: -moz-min-content; 24 width: -webkit-min-content; 25 width: min-content; 26 } 27 28 span { 29 border: 2px solid gray; 30 padding: 0 10px 0 6px; 31 border-width: 0 8px 0 5px; 32 margin: 0 4px 0 3px; 33 background: yellow; 34 } 35 36 f { margin-right: 30px; float: left; } 37 </style> 38 <body> 39 <f class="max"> 40 <div> 41 <span>‮a‭bc</span><span>d‮e‭f</span> 42 </div> 43 <div> 44 <span>‮a‭bc</span>aa<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><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 <span>d‮e‭f</span> 69 </div> 70 <div> 71 <span>‮a‭bc</span>aa </div> 72 </f> 73 74 <f class="min"> 75 <div> 76 <span>‮a‭bc</span><span>d‮e‭f</span> 77 </div> 78 <div> 79 <span>‮a‭bc</span>aa<span>d‮e‭f</span> 80 </div> 81 <div> 82 <span>‮a‭bc</span> <span>d‮e‭f</span> 83 </div> 84 <!-- Bug 1556444 --> 85 <div> 86 <span>‮a‭bc </span><span>d‮e‭f</span> 87 </div> 88 <div> 89 <span>‮a‭bc</span><span> d‮e‭f</span> 90 </div> 91 <div> 92 <span>‮a‭bc</span> aa<span>d‮e‭f</span> 93 </div> 94 <div> 95 <span>‮a‭bc </span>aa<span>d‮e‭f</span> 96 </div> 97 <div> 98 <span>‮a‭bc</span>aa<span> d‮e‭f</span> 99 </div> 100 <div> 101 <span>‮a‭bc</span> aa <span>d‮e‭f</span> 102 </div> 103 <div> 104 <span>‮a‭bc</span>aa <span>d‮e‭f</span> 105 </div> 106 <div> 107 <span>‮a‭bc</span>aa </div> 108 </f>