Tengo una imagen de vector de escala y quiero que llene un contenedor. Hay un par de este tipo de preguntas en SO, aunque son un poco viejas. P.ej. Stretch and scale CSS background¿Cómo hacer que la imagen/imagen de fondo se estire para llenar el contenedor a través de CSS?
Sin embargo, cuando he intentado implementar tales soluciones, los resultados han sido decepcionantes.
Por ejemplo:
body {
margin: 0;
padding: 0;
text-align: center;
color: #000;
background-color: #000
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
}
...
.twoColLiqLtHdr #container {
width: 80%;
margin: 0 auto;
border: 2px solid #000000;
text-align: left;
background-color: #003;
background-image: url('background_image.svg');
/*background-position: 80% 80%; */
background-repeat: no-repeat;
color: #000;
font-family: "Times", cursive;
background-attachment:fixed;
min-height:100%;
/*top: 0;
left: 0; */
}
He intentado varios arreglos, pero no puedo hacer que se extienden sin dejar zonas en blanco (la repetición es un éxito de todo tipo, pero se ve horrible).
Sin embargo, dado que estoy trabajando con un svg, me estoy acercando a esto de una manera incorrecta, ¿debería usar una etiqueta svg xmlns en el html? (P. S. Soy consciente de la imposibilidad absoluta de IE8 para manejar IVS)
Gracias. la cubierta cubre con éxito el contenedor. Sin embargo, y curiosamente, la imagen está demasiado 'ampliada', de modo que solo la mitad superior de la imagen es visible. o.O Como tengo la imagen fija, no es posible ver el resto de la imagen ... – user137263
Ya no es necesario 'background-attachment: fixed;', ¡ya que cubrirá toda la altura! – Giona
Me desconcierta un poco, pero la imagen de fondo parece desaparecer por completo cuando ya no está fija. : p – user137263