2010-12-01 6 views
0

다른 절대 위치를 포함하는 div의 높이를 넣는 방법은 무엇입니까? DIV C가 넘는 컨테이너를 무릎 수 있기 때문에다른 절대 위치를 포함하는 div의 높이를 넣는 방법은 무엇입니까?

<html> 
<head> 
<style type="text/css"> 
.a{ 

} 
.b{ 
position:relative; 
} 
.c{ 
position:absolute; 
} 
</style> 
</head> 

<body> 

<div class="a"> 
<div class="b"> 
<div class="c"> 
    ESTO ES LO QUE CONTIENE EL DIV<br/> 
    ESTO ES LO QUE CONTIENE EL DIV<br/> 
    ESTO ES LO QUE CONTIENE EL DIV<br/> 
    ESTO ES LO QUE CONTIENE EL DIV<br/> 
</div> 
</div> 
</div> 


</body> 

</html> 

사업부 클래스의 높이는 "a"는, 당신은 DIV B에게 DIV C보다 작은 높이를 줄 경우 문제가되지 않습니다 제로

+0

왜 'c'를 절대적으로 배치해야합니까? 위치를 변경하면 (예 : '상단'및 '왼쪽'스타일 수정) '크기'및/또는 위치가 'a'및 'b'로 변경 될 것으로 예상됩니까? – Emmett

답변

2

절대적으로 위치 요소가 <div class='a'> 그것을 포장 확장되지 것을 의미, 레이아웃의 모든 공간을 차지하지 않는 질문을하지 않은 경우.

당신이 이것을 할 수있는 유일한 방법은 자바 스크립트를 통해 .c의 높이를 측정 한 다음 명시 적으로 .a의 높이를 설정하는 것입니다 - 물론 단점은 자바 스크립트가 그렇게해야한다는 것입니다.

위치를 바꾼 위치에 따라 .c을 대신 사용하여 float을 사용하는 것이 좋습니다.

+0

떠 다니는 요소와 같은 소리가 실제로 필요한 것입니다. JS를 사용하는 것은 큰 두통이 될 것입니다 ... –

0

입니다.

미안 해요 잘

0

<div> 또는 다른 블록 컨테이너는 내용에 따라 자동으로 세로로 커지지 만, position:absolute이면 <div>이면 부모 콘텐츠에서 제거하고 더 이상 부모를 확장하지 않습니다.

<div class="c">을 절대 위치시키지 않고 플로팅하려고 할 수 있습니다. 그런 식으로 div는 부모 콘텐츠의 일부로 계속 사용되지만 float 요소로 확장하려면 을 overflow:auto으로 설정해야합니다.

관련 문제