오버플로 내용이 공간을 차지하지 않도록하십시오.

Question

가변 개수의 div가 포함 된 listing이 포함 된 컨테이너 div listings_container이 있습니다. 각각 앞에 div가 지워집니다. 컨테이너 div listings_container의 CSS 속성은 overflow-x: hidden; overflow-y: auto;이며 고정 된 값은 width이고 max-height입니다.

문제 : 오버플로 된 div가 공간을 차지하지 않도록하려면 어떻게해야합니까? listings_container의 높이가 30px이고 listing의 높이가 10px라고 가정 해보십시오. listing이 listings_container 안에 4 개 이상있는 경우 4 번째 listing div가 숨겨지고 listing_cotainer에 세로 스크롤 막대가 나타납니다. 공백이 넘쳐서 listing div가되면 listings_container에서 다른 부동 소수점 div를 지울 수 있습니다. 이는 피하고 싶습니다.

정말 도움이 되었습니까? 감사!

Answer 1

오버플로 콘텐츠는 자동으로 사용하지 않으면 컨트롤의 경계를 벗어나므로 꽤 쓸모없는 효과를냅니다. div의 크기를 설정하면 내용이 오버플로되지 않는 한 자동으로 사용하고 싶지 않을 것입니다.

옵션은 숨기거나 스크롤하여 크기를 고정합니다. 개인적으로 저는 기본적으로 overflow-y : scroll을 사용하는 스크롤 컨테이너를 사용합니다. 고정 된 높이를 사용하십시오.