Css: реагировать на другие div, когда скрывает предыдущий div

Question

Моя страница здесь: https://webtan.jp/

Я скрываю этот раздел:

#top__fullcarousel {
    display: none;

}

но после его скрытия, следующая часть (siteContent block) не уместился ( ошибка здесь )

Я исправил заполнение, и оно работает только с областью просмотра (минимальная ширина 1200px), неправильно работает с другими областями просмотра (mobile, ipad ...)

.siteContent {
    padding-top: 129px;

}

Как мне отреагировать в этом случае?

Answer 1

Вы можете явно установить необходимые отступы для каждого устройства по ширине:

@media screen and (max-width: 1000px) {
  .siteContent {
    padding-top: 129px;
  }
}

@media screen and (max-width: 850px) {
  .siteContent {
    padding-top: 109px;
  }
}

@media screen and (max-width: 600px) {
  .siteContent {
    padding-top: 89px;
  }
}

@media screen and (max-width: 320px) {
  .siteContent {
    padding-top: 69px;
  }
}

Конечно, вы можете использовать множество других методов, но этот способ наиболее прост.