Прокручиваемый div с nowrap и скрытой полосой прокрутки

Question

Я пытаюсь сделать горизонтальное меню, состоящее из родительского div с overflow:hidden и ребенком с overflow:auto. Это позволяет мне иметь прокручиваемый div без полосы прокрутки. Однако, чтобы предотвратить разрыв элементов li, дочерний элемент имеет атрибут white-space:nowrap. Это снова закроет полосу прокрутки. Я попытался использовать display:table в качестве альтернативы nowrap, но это не позволяет прокручивать. Любые идеи о том, как действовать? Благодаря

UPDATE: Видя, как я не смог правильно объяснить себе, я загрузил небольшой пример того, что я хочу на jsfiddle: LINK Я хочу, чтобы список элементов рядом друг с другом, которая шире, чем контейнер и для того, чтобы пользователь мог прокручивать, но без отображения полосы прокрутки. Если у меня есть атрибут white-space:nowrap, панель прокрутки присутствует, но если я ее удалю, элементы будут переходить друг под друга. Спасибо!

Answer 1

#wrapper { 
 
    width: 250px; 
 
    overflow: hidden; 
 
    outline: 1px solid blue; 
 
} 
 

 
#scroller { 
 
    width: 270px; 
 
    height: 100px; 
 
    overflow: auto; 
 
    
 
}

<div id="wrapper"> 
 
    <div id="scroller"> 
 
     foo<br>bar<br>baz<br>foo<br>bar<br>baz<br>foo<br>bar<br>baz<br> 
 
     foo<br>bar<br>baz<br>foo<br>bar<br>baz<br>foo<br>bar<br>baz<br> 
 
     foo<br>bar<br>

Try This One For Например