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:
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.<div id="test" style="background: url(overlay-green.png), url(lalala.jpg);">
</div>
</div>
Esto es lo que tengo, no soy un desarrollador frontend, asi que esto me esta causando corticircuitos mentales.
Cita:
asi que.... finalmente ... alguna idea de como conseguir que esto funcione en el "bendito IE" ? <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>
</div>
De antemano muchas gracias!! :)