nowrap 및 숨김 스크롤 바를 사용하여 스크롤 할 수있는 div

Question

overflow:hidden 인 부모 div와 overflow:auto 인 자식으로 구성된 가로 메뉴를 만들려고합니다. 스크롤바가없는 스크롤 가능한 div를 가질 수 있습니다. 그러나 li 요소의 중단을 방지하기 위해 자식 요소는 white-space:nowrap 특성을 갖습니다. 그러면 스크롤 막대가 다시 나타납니다. 나는 nowrap에 대한 대안으로 display:table을 사용했지만 스크롤을 허용하지 않았습니다. 진행 방법에 대한 아이디어가 있으십니까? 감사

UPDATE : 다음보다 넓은있는 서로 LINK 내가 항목의 목록을 원하는 : 내가 제대로 자신을 설명 할 수 없었던으로보고, 나는 내가 무엇을 jsfiddle에서 원하는 작은 예를 업로드 사용자가 스크롤 할 수 있지만 스크롤 막대가 표시되지 않도록 할 수 있습니다. 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>

원하는 동작을 포함해야 디버깅 도움 ("왜이 코드가 작동하지?")을 찾는 예