input-range-zero-inline-size.html (1169B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Setting inline-size to zero on input[type=range] should be honored.</title> 5 <link rel="author" title="Tim Nguyen" href="https://github.com/nt1m"> 6 <link rel="help" href="https://drafts.csswg.org/css-writing-modes/"> 7 <link rel="match" href="input-range-zero-inline-size-ref.html"> 8 </head> 9 <body> 10 <style> 11 div { 12 display: flex; 13 background-color: red; 14 border-inline-start: 1px solid green; 15 } 16 .horizontal { 17 background-color: transparent; 18 } 19 input[type=range] { 20 visibility: hidden; 21 inline-size: 0; 22 margin: 0; 23 } 24 </style> 25 26 <p>Test passes if you see no red:</p> 27 28 <div class="horizontal"><span style="display: inline-flex; background-color: red;"><input type="range"></span></div> 29 <div style="writing-mode: vertical-lr;"><input type="range"></div> 30 <div style="writing-mode: vertical-rl;"><input type="range"></div> 31 <div style="writing-mode: sideways-lr;"><input type="range"></div> 32 <div style="writing-mode: sideways-rl;"><input type="range"></div> 33 </body> 34 </html>