I need to keep the size of the image on the right

Right now I have block sizes that change with the size of the image. Tried to set width: 400px and height: 350px, my page looked bad.

I need to stretch the picture

HTML (inside JS):

project.className = "col-md-4 col-sm-6 projectsBlock"
project.innerHTML = `<a href="project.html">
                     <h4 class="text-center">${name}</h4>
                     <img src="${image}" ></a>`

CSS:

@keyframes Appearance{
0%{opacity: 0; transform: translateY(-120px);}
100%{opacity: 1;}
}

.projectsBlock{
animation-name: Appearance;
animation-duration: 0.2s;
}

.projectsBlock > a{
text-decoration: none;
}

.projectsBlock > a > img{
border: solid 3px black;
border-radius: 10px;
width: 100%;
display: block;
}


.projectsBlock > a > h4{
color: white;
position: relative;
top: 40px;
text-shadow: 2px 2px 0 #000;
}