Product Landing Page Image Proportion Not maintained

HTML-CSS
1

How come my #header-img won’t maintain it’s proportion.

This doesn’t work
#header-img{
width:100px;
height:auto;
}

2

The problem arises because you’re using a flex layout for your header element and it stretches your image by default. Change your #header-img to:

#header-img{
width:100px;
height:auto;
align-self: start; /* ADD THIS */
}