image will not scale to 100% of div properly? - css

Question

I am trying to make the image take up the whole page for my component but cannot figure out what I am doing wrong?
this is how it currently looks and I cannot figure out how to ensure it takes up the extra whitespace marked in red too.
I tried setting the min width and height of the div it is contained in. Is it maybe I need to set the image up in the body but I was confused how to do that in react.
current page:
css:
.container {
background-image: url("../images/img.jpg");
background-repeat: no-repeat;
background-size: contain;
min-height: 100%;
min-width: 100%;
}
.default-button {
align-items: center;
background-clip: padding-box;
background-color: #fa6400;
border: 1px solid transparent;
border-radius: .25rem;
box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0;
box-sizing: border-box;
color: #fff;
cursor: pointer;
display: inline-flex;
font-family: "Rams Black";
font-size: 16px;
font-weight: 600;
justify-content: center;
line-height: 1.25;
margin: 0;
min-height: 3rem;
padding: calc(.875rem - 1px) calc(1.5rem - 1px);
position: relative;
text-decoration: none;
transition: all 250ms;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
vertical-align: baseline;
width: auto;
}
.default-button:hover,
.default-button:focus {
background-color: #fb8332;
box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
}
.default-button:hover {
transform: translateY(-1px);
}
.default-button:active {
background-color: #c85000;
box-shadow: rgba(0, 0, 0, .06) 0 2px 4px;
transform: translateY(0);
}
.powered-by-strava {
display: flex;
align-items: center;
justify-content: center;
}
.connect-btn {
background-color: transparent;
padding: 0;
border: none;
background: none;
}
component where image is rendered:
return (
<div className="container">
<button className="connect-btn" onClick={stravaAuth}><img src={connectSVG}
alt="Connect to Strava"/></button>
<button onClick={changeTheme}>Change mode</button>
<div className="powered-by-strava">
<img className="strava-img" src={poweredSVG}/>
</div>
</div>
);