아래는 제가 작업중인 코드입니다. 보시다시피 '#parent'div와 '#child'div가 있습니다. '#child'div는 높이가 정의되지 않았습니다. 이는 때때로 '#child'의 높이가 아래에 적힌 '400px'인 부모의 높이보다 작거나 길기 때문입니다. 내가 얻는 문제는 아이의 키가 #parents 키보다 길 때마다 #child의 콘텐츠가 겹치거나 부모의 랩 외부로 전달된다는 것입니다.
<style>
#parent{
position: relative;
height: 400px;
width: 500px;
}
#child{
position: absolute;
top: 0px;
right: 0px;
}
</style>
<div id="parent">
<div id="child">
//Some content
</div>
</div>
오버플로 콘텐츠를 #child
숨기려면 다음을 사용하세요.
#parent {
overflow: hidden;
}
여전히에서 모든 콘텐츠를 볼 수 있도록하려면 #child
스크롤바에 포함 할 수 있습니다. 그러면의 높이 #child
가의 높이와 충돌하지 않습니다 #parent
.
#parent {
overflow: auto;
}
편집하다:
당신이 원하는 경우 #parent
와 스트레칭의 높이를 #child
, #child
절대 위치 할 수 없습니다. 그것을 벗으면 작동 할 것입니다. 높이를 400px 이상으로하려면 다음을 사용할 수 있습니다.
#parent {
min-height: 400px;
}
바이올린 참조 : http://jsfiddle.net/VYrLh/
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다