transform-fixed-bg-006.html (1593B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Test (Transforms): Fixed Background (transform of intermediate)</title> 5 <link rel="author" title="Aryeh Gregor" href="mailto:ayg@aryeh.name"> 6 <link rel="author" title="L. David Baron" href="https://dbaron.org/"> 7 <link rel="author" title="Google" href="http://www.google.com/"> 8 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#transform-rendering"> 9 <meta name="assert" content='"Fixed backgrounds on the root element are 10 affected by any transform specified for that element. For all other 11 elements that are effected by a transform (i.e. have a transform applied 12 to them, or to any of their ancestor elements), a value of fixed for the 13 background-attachment property is treated as if it had a value of scroll." 14 This tests that adding a rotation to a non-root element doesn't 15 change rendering of fixed backgrounds on its descendants relative to what 16 they would be if background-attachment: scroll.'> 17 <meta name="flags" content="svg"> 18 <link rel="match" href="transform-fixed-bg-ref.html"> 19 <meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-200"> 20 <style> 21 body { 22 margin: 0; 23 transform: rotate(90deg); 24 transform-origin: 100px 100px; 25 overflow: hidden; 26 } 27 div { 28 background: url(support/transform-triangle-down.svg) fixed; 29 width: 100px; 30 height: 100px; 31 position: relative; 32 left: 50px; 33 top: 50px; 34 } 35 </style> 36 </head> 37 <body> 38 <div></div> 39 </body> 40 </html>