How do I adjust this image inside the border in HTML 5.
HTML
<figure class="foto-legenda">
<img src="_imagens/coz21web.jpg" width="830">
<figcaption>
<h3>Marcenaria Anderlopes</h3>
<p>Realizando sonhos</p>
</figcaption>
</figure>
CSS
figure.foto-legenda {
position: relative;
border: 8px solid white;
box-shadow: 1px 1px 4px black;}
figure.foto-legenda figcaption {
opacity: 0;
position: absolute;
top: 0px;
background-color: rgba(0, 0, 0, .3);
color: white;
padding: 10px;
box-sizing: border-box;
transition: opacity 1s;
height: 100%;
width: 100%; }
figure.foto-legenda:hover figcaption {opacity: 1;}