overflow-hidden-region-with-negative-left-positioned-element.html (590B)
1 <!DOCTYPE html> 2 <meta name="viewport" content="width=device-width, minimum-scale=0.25"> 3 <style> 4 html { 5 overflow: hidden; 6 } 7 html, body { 8 margin: 0; 9 width: 100%; 10 height: 100%; 11 } 12 div { 13 position: absolute; 14 } 15 </style> 16 <!-- 17 Even if minimum-scale=0.25 is specified, the widest element in this content is 18 below div element whose *real* width is 200% because of `margin-left: -500%`, 19 so this content should be scaled to 0.5x. 20 --> 21 <div style="background: green; width: 700%; height: 500%; margin-left: -500%;"></div> 22 <div style="background: blue; width: 100%; height: 100%;"></div>