place-self-shorthand.html (1108B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Box Alignment Level 3: place-self sets longhands</title> 6 <link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-place-self"> 7 <meta name="assert" content="place-self supports the full grammar '<align-self> <justify-self>?'."> 8 <meta name="assert" content="<baseline-position> and <baseline-position> start are equivalent."> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <script src="/css/support/shorthand-testcommon.js"></script> 12 </head> 13 <body> 14 <script> 15 test_shorthand_value('place-self', 'normal', { 16 'align-self': 'normal', 17 'justify-self': 'normal' 18 }); 19 20 test_shorthand_value('place-self', 'first baseline', { 21 'align-self': 'baseline', 22 'justify-self': 'baseline' 23 }); 24 25 test_shorthand_value('place-self', 'last baseline flex-start', { 26 'align-self': 'last baseline', 27 'justify-self': 'flex-start' 28 }); 29 30 test_shorthand_value('place-self', 'unsafe self-start stretch', { 31 'align-self': 'unsafe self-start', 32 'justify-self': 'stretch' 33 }); 34 </script> 35 </body> 36 </html>