Hola!
Basicamente necesito renderizar una imagen como background y un color como overlay en el mismo div, por lo tanto queda la imagen con una capa del color que se escoja, algo como esto:
.green{
background: url(overlay-green.png), url(lalala.jpg);
background-size: contain;
}
la cosa es que necesito hacerlo con inline no con una clase, algo asi:
Cita: <div id="test" style="background: url(overlay-green.png), url(lalala.jpg);">
</div>
y evidentemente que esto funcione en IE7, IE8 y IE9, de momento solo he podido conseguir que se muestre solo uno, o bien la imagen o bien el color, necesito alguna manera de filtrar esto , y que minimo se muestren los dos en IE9, de alguna manera solo mostrar el color en versiones anteriores.
Esto es lo que tengo, no soy un desarrollador frontend, asi que esto me esta causando corticircuitos mentales.
Cita: <div class="library-item green" style="background: rgb(0,0,255); background: -ms-linear-gradient(top, rgba(0,0,255,0.5),rgba(0,0,255,0.5)),url(lalala.jp g); background: -moz-linear-gradient(top, rgba(0,0,255,0.5) 100%, rgba(0,0,255,0.5 100%)),url(lalala.jpg); background: -webkit-linear-gradient(top, rgba(0,0,255,0.5),rgba(0,0,255,0.5)),url(lalala.jp g); background: linear-gradient(to bottom, rgba(0,0,255,0.5) 100%, rgba(0,0,255,0.5) 100%),url(lalala.jpg); background-size: contain;">
</div>
asi que.... finalmente ... alguna idea de como conseguir que esto funcione en el "bendito IE" ?
De antemano muchas gracias!! :)