transform-translate-background-001.html (828B)
1 <!DOCTYPE html> 2 <html> 3 <meta charset="utf-8"> 4 <title>CSS Transforms: Translate gradient background on root element</title> 5 <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com"> 6 <link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-rendering"> 7 <link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=988446"> 8 <link rel="match" href="transform-translate-background-001-ref.html"> 9 <meta name="assert" content="Checks that the linear gradient is not modified when you vertically translate the root element. The test passes if you see only green."> 10 <style> 11 html { 12 background: linear-gradient(to bottom, green 0%, green 50%, red 50%, red 100%); 13 transform: translate(0, -250vh); 14 overflow: hidden; 15 } 16 </style> 17 <div style="height: 400vh;"></div> 18 </html>