clone-intrinsic-size-bidi.html (2976B)
1 <!DOCTYPE html> 2 <head> 3 <title>CSS Test: min/max-content size on box-decoration-break:clone 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="clone-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 -webkit-box-decoration-break: clone; 35 box-decoration-break: clone; 36 } 37 38 f { margin-right: 30px; float: left; } 39 </style> 40 <body> 41 <f class="max"> 42 <div> 43 <span>‮a‭bc</span><span>d‮e‭f</span> 44 </div> 45 <div> 46 <span>‮a‭bc</span>aa<span>d‮e‭f</span> 47 </div> 48 <div> 49 <span>‮a‭bc</span> <span>d‮e‭f</span> 50 </div> 51 <div> 52 <span>‮a‭bc </span><span>d‮e‭f</span> 53 </div> 54 <div> 55 <span>‮a‭bc</span><span> d‮e‭f</span> 56 </div> 57 <div> 58 <span>‮a‭bc</span> aa<span>d‮e‭f</span> 59 </div> 60 <div> 61 <span>‮a‭bc </span>aa<span>d‮e‭f</span> 62 </div> 63 <div> 64 <span>‮a‭bc</span>aa<span> d‮e‭f</span> 65 </div> 66 <div> 67 <span>‮a‭bc</span> aa <span>d‮e‭f</span> 68 </div> 69 <div> 70 <span>‮a‭bc</span>aa <span>d‮e‭f</span> 71 </div> 72 <div> 73 <span>‮a‭bc</span>aa </div> 74 </f> 75 76 <f class="min"> 77 <div> 78 <span>‮a‭bc</span><span>d‮e‭f</span> 79 </div> 80 <div> 81 <span>‮a‭bc</span>aa<span>d‮e‭f</span> 82 </div> 83 <!-- Bug 1556444 --> 84 <div> 85 <span>‮a‭bc</span> <span>d‮e‭f</span> 86 </div> 87 <!-- Bug 1556444 --> 88 <div> 89 <span>‮a‭bc </span><span>d‮e‭f</span> 90 </div> 91 <div> 92 <span>‮a‭bc</span><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 <!-- Bug 1556444 --> 104 <div> 105 <span>‮a‭bc</span> aa <span>d‮e‭f</span> 106 </div> 107 <!-- Bug 1556444 --> 108 <div> 109 <span>‮a‭bc</span>aa <span>d‮e‭f</span> 110 </div> 111 <div> 112 <span>‮a‭bc</span>aa </div> 113 </f>