text-transform-shaping-001.html (1229B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Text level 3 Test: text-transform:capitalize and text-shaping</title> 4 <link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> 5 <link rel="help" href="https://www.w3.org/TR/css-text-3/#boundary-shaping"> 6 <link rel="help" href="https://www.w3.org/TR/css-text-3/#text-transform-property"> 7 <link rel="match" href="reference/text-transform-shaping-001-ref.html"> 8 <meta name="assert" content="Text shaping must not be broken across inline box boundaries when there is no change in formatting. Arabic is not a bicameral script, so text-transform:capitalize has no effect, and should not affect shaping."> 9 <style> 10 div { font-size: 4em; } 11 div:last-of-type::first-letter { text-transform: capitalize; } 12 body { 13 /* Optional bit, just to avoid the arabic strings being too far off to the right, 14 which makes them harder to notice if you're going through a lot of tests 15 and not paying all that much attention. */ 16 max-width: 600px; 17 max-width: max-content; 18 } 19 </style> 20 21 <p>Test passes if there are two identical strings below. Pay attention to the right-most character. 22 <div dir=rtl lang=ar>عائلة</div> 23 <div dir=rtl lang=ar>عائلة</div>