intrinsic-aspect-ratio-ref.html (778B)
1 <!DOCTYPE html> 2 <html> 3 <title>View transitions: different width container should keep aspect ratio (by default)</title> 4 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/"> 5 <link rel="author" href="mailto:vmpstr@chromium.org"> 6 <style> 7 .spacer { 8 /* 10px - border from above and below */ 9 height: 6px; 10 } 11 .smallbox { 12 width: 50px; 13 height: 50px; 14 background: blue; 15 } 16 .bigbox { 17 width: 200px; 18 height: 200px; 19 background: blue; 20 } 21 22 body { background: lightpink; } 23 </style> 24 25 <div style="width: 50px; height: 100px; border: 2px solid black"> 26 <div style="height: 50px; background: blue"></div> 27 </div> 28 <div class=spacer></div> 29 <div style="width: 200px; height: 100px; border: 2px solid black"> 30 <div style="height: 200px; background: blue"></div> 31 </div>