Блок выходит за границы экрана при уменьшении экрана (overflow не помогает)

Question

При уменьшении экрана блок .gallery выходит за границы экрана. Overflow для html и body не помогает (может не туда писал, но обычно помогал)

Другими словами - появляется горизонтальная полоса прокрутки.

Answer 1

Попробуйте вставить где-нибудь в код:

<script>
window.addEventListener('resize',(e)=> { 
  document.querySelector('.container_gallery').style.transform = 
    document.body.clientWidth>1300 ? '' : 
      `scale(${document.body.clientWidth/1380}) translate(${-(1300-document.body.clientWidth)/2}px)`; 
});
</script>

Должно помочь.

Answer 2

прямо в блок gallery (или его класс) впишите overflow-x: scroll, пример:

 <div class="gallery" style="overflow-x: scroll;">
  ...
 </div>

или

 <style>
 .gallery { 
    overflow-x: scroll;
    ...
 }
 </style>
 <div class="gallery">
  ...
 </div>

тогда Ваши фотки станут просматриваемыми на мобильной версии, ну или сюда впишите overflow:hidden, если надо скрыть. также поменяйте на display: inline в блок icons

БЛОГ НА HUSL

Блок выходит за границы экрана при уменьшении экрана (overflow не помогает)

Ответы (2 шт):