У меня есть раздел div с фоновым изображением.Раздел div имеет переменную ширину, но фиксированную высоту.Фоновые изображения всегда совпадают с разделом div и располагаются в центре снизу.
footer{
position: absolute;
bottom: -20px;
left: 0;
right: 0;
height: 300px;
width: 100%;
color: #fff;
background-color: #7f7f7f;
}
footer::before{
content: "";
position: absolute;
top: 0px;
height: 100%;
width: 100%;
background-image: url("./img.png");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: bottom center;
opacity: 0.4;
}
Если теперь раздел div переходит в ширину, фоновое изображение становится в высоту и обрезается сверху,Я хотел бы изменить положение на верхний центр, если изображение становится в высоту и поэтому обрезать нижнюю часть изображения.Есть ли решение для достижения этого эффекта?