css - Fixed element in transform translate container not working -


i have wrapper box want animate transform translate if can't use fixed element inside.

example :

<div class="wrapper">     <div class="box-content">         <div class="fixed-element">          </div>     </div> </div>  <style type="text/css">      .wrapper {         transform: translatex(50px);         background: pink;     }      .box-content {         height: 1000px;         background: green;     }      .fixed-element{         position: fixed;         top: 0;         left: 0;         width: 50px;         height: 50px;         background: blue;     }  </style> 

https://jsfiddle.net/aobv5azy/

i don't want use javascript, , want use transform translate. animate "left" not performances.


Comments

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

php - Best Light server (Linux + Web server + Database) for Raspberry Pi -

c# - "Newtonsoft.Json.JsonSerializationException unable to find constructor to use for types" error when deserializing class -