Tengo lo siguiente en html5 y css3, el problema es que la imagen no me respeta el contenedor div y quiero que la imagen se ajuste automáticamente al tamaño del contenedor para que se mantenga dentro de dicho contenedor marcado con un fondo rojo.
en el <div class="pleca2">
marcado con fondo azul ira otra imagen pero las 2 deben mantenerse dentro del <div class="columna">
logrando un resultado exactamente igual ya que cuento con las 3 imágenes que se muestran abajo.
[![introducir la descripción de la imagen aquí][1]][1]
lo que tengo me da el siguiente resultado [![introducir la descripción de la imagen aquí][2]][2]
</div>
</div>
<div class="columx2">
<div class="columna">
<h1>Accesorios</h1>
<div class="pleca2">
<img src="img/Pleca cafe-01.png" alt="" >
</div>
<img src="img/Sombreros/aretes.png" alt="">
</div>
</div>
</section>