Bootstrap 3 panel mobile scrolling/responseiveness

Вот моя проблема: я пытаюсь реализовать панель bootstrap 3 со списком пользователей внутри. Этот список находится внутри другой панели bootstrap 3. Смотрите здесь: https://jsfiddle.net/gwnyyvaa/Bootstrap 3 panel mobile scrolling/responseiveness

ok some apparently some code is needed here

Теперь проблема заключается в том, что на мобильном телефоне, она не позволяет скроллинг. Я ожидал, что он позволит прокручивать, так как экран мобильного телефона является малым, чтобы отображать его на одной странице.

Спасибо!

источник

2017-02-12 BusinessGuy

Bootstrap автоматически не производит прокрутку панелей, если на панели слишком много текста. Поэтому вы должны добавить CSS, чтобы сделать это самостоятельно. Вот CSS вам нужно добавить:

.users_list .panel-body { 
    overflow-x: auto; 
}

Это заставит .panel-body из .user_list для прокрутки по горизонтали, если текст будет переполнение контейнера.

Вот скрипка с выше CSS добавила: https://jsfiddle.net/89cpmctt/1/

Если вы хотите, чтобы прокручивать по вертикали, то вам придется назначить высоту панели. Это связано с тем, что divs будет расширяться вертикально, чтобы соответствовать содержимому. Поэтому вам нужно добавить height собственности на .panel-body. Наряду с overflow-y:auto. Вот пример

.panel-body { 
    height: 500px; 
    overflow-y: auto; 
}

источник

2017-02-12 19:55:11

Я добавил код, и панель прокручивается хорошо. Однако только панель внутри родительской панели. Фактическая панель, содержащая все, по-прежнему не прокручивается. Я попробую прокрутить его, используя это свойство переполнения. У вас есть представление о том, что может быть проблемой? Спасибо за помощь! – BusinessGuy

Я только что заметил, что ты сказал по горизонтали. Я хотел прокрутить вертикально. Он по-прежнему не работает, даже если я меняю его на overflow-y. Вот моя проблема конкретно: 1 изображение, показывающее полную панель: http://pasteboard.co/xAhW0DMbN.png 2 image: http://pasteboard.co/xAhibEmT6.png, показывающий его изменение размера. Полоса прокрутки показывает, но она не прокручивается до кнопки, как показано на рисунке 1 – BusinessGuy

@BusinessGuy Если вы хотите, чтобы она прокручивалась, вам нужно добавить свойство 'height' в' .panel-body' в вашем CSS-код. Наряду с 'overflow-y: auto', конечно. –

ответ

Смежные вопросы