비활성화 Y 스크롤 디스플레이로 설정 자식 요소 요소 :

Question

은 내가 (수평 줄을 자식 된 div를 얻을 수있는 방법 부모 DIV와 자식의 무리

<div id="container"> 
    <div class="child">stuff</div> 
    <div class="child">stuff</div> 
    <div class="child">stuff</div> 
    <div class="child">stuff</div> 
    <div class="child">stuff</div> 
    <div class="child">stuff</div> 
    etc. 
</div> 

div를 말해봐 인라인 블록 inline-block) 오버플로 - y 스크롤 막대를 비활성화하고 하위 div가 왼쪽에서 오른쪽으로 계속 생성하도록 하시겠습니까?

http://jsfiddle.net/cpofvohr/

Answer 1

당신은 포장을 방지하기 위해 #container에 white-space: pre 또는 white-space: nowrap를 추가해야합니다. 공백`사용하는 경우 같은 방법으로

Updated Fiddle

var div = document.getElementById("container"); 
 

 
for (i = 1; i < 40; i++) { 
 
    var div2 = document.createElement("div"); 
 
    div2.className = "child"; 
 
    var text = document.createTextNode(i) 
 
    div2.appendChild(text); 
 
    div.appendChild(div2); 
 
}

.child { 
 
    background-color: #D8D8D8; 
 
    height: 375px; 
 
    width: 30px; 
 
    margin: 3px; 
 
    display: inline-block; 
 
} 
 
#container { 
 
    width: auto; 
 
    min-width: 100px; 
 
    max-height: 400px; 
 
    overflow-x: scroll; 
 
    position: relative; 
 
    min-height: 100%; 
 
    white-space: pre; 
 
}

<div id="container"></div>

는