Горизонтальная прокрутка, необходимая для просмотра сайта на мобильных устройствах

Question

У меня есть веб-сайт Wordpress, и по какой-то странной причине, когда я открываю его через свой iPhone или любое другое мобильное устройство, я вижу только фон сайта и только если я много прокручиваю справа я вижу полный сайт.

Я приложил скриншот, чтобы вы все могли видеть, что я имею в виду, или просто попробуйте открыть http://sivantalmor.com и посмотрите сами.

Есть ли CSS, который я могу использовать, чтобы исправить эту проблему?

Answer 1

Я не 100% уверен, что причина этого, но это, кажется, работает:

Добавьте overflow-x: hidden; свойства вашей сНу # основного

Как так:

<div id="main" role="main" style="overflow-x: hidden;"> 
</div> 

Редактировать:

Проблема здесь:

<div class="audio-player" style="direction: ltr;"></div> 

Вы можете удалить direction: ltr; это тот вызывает все это. Но тогда вам придется исправить некоторые поля для элемента, обертывающего фотографию альбома.

Answer 2

Точная проблема в части аудиоплеера (# soundcheck_audio_player_widget-2). Внутри находится ссылка .jp-pause, которая расположена за пределами div слева. Это приводит к тому, что страница создает длинную полосу прокрутки влево. Вы можете добавить переполнение: hidden; к этому классу: .jp-controls-wrap

.jp-controls-wrap { 
    overflow: hidden; 
} 

Это трюк!