Fading a divs bg image but not the content inside

Hi there schwim,

here is another example for you to try…

[code]

untitled document #outer { position:relative; width:70%; padding-top:39.375%; /* width*aspect ratio */ margin:auto; background-image:url(/images/background/_0020_mountains.jpg); /* aspect ratio 0.5625 */ background-size:contain; } #inner { position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,1); animation:fadein 5s 1s forwards; /* name, duration, delay, stop */ } #inner img { display:block; width:80%; margin:10% auto; } @keyframes fadein { from { background-color:rgba(255,255,255,1); } to { background-color:rgba(255,255,255,0); } }
[/code]

coothead