Не может скрывать полосу прокрутки при использовании переполнения: auto

У меня есть этот CSS:

.div {
    background-color: red;
    position: relative;
    height: 414px;
    overflow: auto;
    width: 902px;
    margin: 0px auto;
}

Я попробовал с overflow-y: hidden;, полоса прокрутки исчезла, но прокрутка не работает. Надеюсь, ты понимаешь, чего я хочу... Кроме того, следует ли использовать авто или прокрутку? С автоматическим я также вижу горизонтальную полосу.

Вот JSFiddle: http://jsfiddle.net/sp95S/
Спасибо!

Ответ 1

Создайте внутренний div: http://jsfiddle.net/sp95S/1/

.div {
    background-color: red;
    position: relative;
    height: 214px;
    overflow: hidden;
    width: 452px;
    margin: 0px auto;
}
#inner{
    width: 100%;
    overflow: auto;
    height: 100%;
    padding-right: 15px;
}

Ответ 2

Похоже, вы хотите, чтобы страница все еще прокручивалась без отображения полосы прокрутки.

Об этом уже было сказано несколько раз:

В принципе, вы можете использовать javascript (или jquery, хотя вам это и не нужно). В браузерах webkit существует функция скрыть полосы прокрутки:

::-webkit-scrollbar { 
display: none; 
}

но он не будет работать для Firefox или Internet Explorer или Opera.

Ответ 3

Если вы хотите скрыть полосу прокрутки, но сохраните прокрутку, вы можете посмотреть плагин под названием slimscroll. Полоса прокрутки есть, но она может быть настроена так, чтобы быть неизмеримой.

http://rocha.la/jQuery-slimScroll