Изображение обрезается при прокрутке ASP.NET MVC ⇐ CSS

[Anonymous]

У меня происходит обрезка изображения, когда данных больше, чем фактической страницы (если это имеет смысл). При прокрутке я хочу, чтобы изображение всегда было на заднем плане независимо от того, прокручивается ли оно.
Красный кружок — это фоновое изображение, которое обрезается при прокрутке. Зеленый круг — изображение конкретного товара (он длиннее страницы, поэтому присутствует прокрутка). Фиолетовый кружок (попробуйте быстро произнести это 5 раз) — это пустое пространство, которое я хочу заполнить фоновым изображением.
[img]https:/ /i.sstatic.net/3KbWrPlD.png[/img]

Вот что я сделал на данный момент:
img {
max-width: 100%;
}

.img-details {
height: auto;
object-fit: contain;
}

.background-logo-login {
isolation: isolate;
}

.background-logo-login::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
opacity: 0.1;
background-image: url(../img/SAS_web_2.jpg);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-attachment: fixed;
/* background-size: fixed; */
/* background-size: 100% 100vh; */
background-size: cover;
/* overflow-y: auto; */
/* background-size: contain; */
}

ProductDetails.cshtml:



// Getting image from Azure Blob url


// Other code





Подробнее здесь: https://stackoverflow.com/questions/791 ... sp-net-mvc