HTML 레이아웃 스크롤 div를

Question

를이 내가 말하는거다 페이지입니다 : http://searchleaf.com/v2/search_2.php

내 '콘텐츠'사업부있는 페이지의 중간에 떠있는 사업부가 있습니다. 그 안에는 3 개의 div, 나란히있는 'contentboxes'가 있으며 각각은 공간의 33 %를 차지합니다.

첫 번째 콘텐츠 상자에서 검색하면 일부 결과가 반환되고 두 번째 콘텐츠 상자가 표시됩니다. 거기에서 단어를 클릭하면 세 번째 내용 상자가 더 많은 정보와 함께 표시됩니다.

내 문제는 페이지가 축소되거나 한 단어에 대한 많은 정보가 있고, 두 번째 및 세 번째 상자가 주 콘텐츠 상자 위로 흐려지는 경우입니다. 나는 CSS의 오버 플로우 속성을 살펴 봤지만 어떻게하면 좋을지 모르겠다. 주요 콘텐츠 상자에 피가 흘러서는 안됩니다.

주 콘텐츠 상자에서 자동으로 설정된 오버플로가 발생하는 경우 스크롤 막대가 전체 콘텐츠 영역을 표시하고 스크롤합니다.

내가 원하는 일 : 필요한 경우 각 conentbox에 스크롤바가 주어집니다. 여기

내 문제의 간단한 HTML 레이아웃 예입니다,이 쉬울 수 있습니다 :

오버 플로우 속성이 자동으로 .content 변경되는

http://searchleaf.com/v2/layout.html

. 모든 것이 스크롤됩니다. 세 번째 상자를 스크롤하려면 어떻게해야합니까?

감사합니다, 브라이스

Answer 1

문제는 내부 된 div의 폭이 33.3 %로 수 있습니다, 또한 너무 결과 폭은 33.3이다 (그들의 폭에 추가됩니다 두꺼운 테두리와 패딩을 가지고 컨테이너의 % + 테두리의 픽셀 수 + 15px 안쪽 여백 (양쪽 모두)

div에 내부 div를 추가하고 내부 div에 테두리와 패딩을 넣을 수 있습니다. 너비 만 남겨 둡니다. 그게 의미가있는 경우 부모 div의 33.3 %.

Answer 2

UR 주요 컨테이너 및 숨겨진 오버플로를 설정 한 다음 고정 된 높이로 내부 사업부를 설정하고 오버플로 - y를 스크롤하도록 설정합니다.