Как заставить изображение между двумя блоками оставаться на месте
Не знаю как правильно задать вопрос. Проблема в следующем: есть два блока стык между ними закрывает фоновое изображение нужно сделать так что-бы это изображение при адаптации не смещалось
вот тут начальная позиция
а тут при уменьшении
Если убрать contain то она останется на месте но не будет адаптироваться
Подскажите какие есть варианты
.section4 {
position: relative;
width: 100%;
height: 500px;
background: -o-radial-gradient(rgba(207, 130, 79, 0.77), #512112);
background: radial-gradient(rgba(207, 130, 79, 0.77), #512112);
}
.section4__bg1 {
position: absolute;
bottom: -65px;
width: 100%;
height: 100%;
background: url("img/bg_block4_down.png") no-repeat center bottom/contain;
z-index: 1;
}
.section5 {
width: 100%;
height: 500px;
background: -o-radial-gradient(rgba(253, 176, 24, 0.66), #fdb11a);
background: radial-gradient(rgba(253, 176, 24, 0.66), #fdb11a);
}<section class="section4">
<div class="section4__bg1"></div>
</section>
<section class="section5">
</section>Как изображение добавить не знаю