Quisiera saber definir el ancho de una imagen en un div
sin tener la necesidad de aplicarle los pixeles, sino por porcentaje, ya que al aplicarle los píxeles al momento de aumentarle/bajarle la resolución quedaría con la misma longitud.
tengo el siguiente código, contiene bootstrap y lo que quiero es hacer que la imagen del fondo del paisaje este al 100% del contenedor pero al colocarle en el css de la imagen la propiedad width=100%;
no lo toma.
*{
padding: 0px;
margin:0px;
}
.container{
position: relative;
width: 100%;
}
#persona{
z-index: 3
}
#contenido{
z-index: 1;
}
#paisaje{
position: absolute;
z-index: 2;
top: 310px;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
<div class="row">
<div class="col-6" id="persona">
<img src="http://www.medicinahiperbarica.com.mx/wp-content/uploads/2015/11/persona-png.png" alt="">
</div>
<div class="col-6 bg-warning" id="contenido">
<h1>Lorem ipsum dolor sit amet, consectetur adipisicing.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi voluptatibus commodi fugit quod, animi alias architecto sapiente in aperiam facilis?</p>
</div>
<div class="col-12" id="paisaje">
<img src="https://softwarelibreenmivida.files.wordpress.com/2009/04/cielo-recortado.jpg" alt="">
</div>
</div>
</div>