div를 div에 맞게 세로로 확장합니까?

div가 세로로 확장되는 데 문제가 있습니다.div를 div에 맞게 세로로 확장합니까?

내가 이런 걸 가지고 불을 지르고에서

<div class='headerWrapper'> 
    <div class='header'> 
     <img..... height=100> 
    </div> 
</div>

는, 헤더 DIV (100)의 높이가의 headerWrapper div의 이미지가 아래 사업부에서 볼 수 0

의 높이가 그것 .... headerWrapper div에 고정 된 높이가 없습니다.

혼란스러워.

고맙다 - 조나단

출처

2011-03-27 Jonathan

스타일을 게시 할 수 있습니까? 특히'.header '나 그 내용이 떠 다니거나 절대적으로 위치합니까? – marramgrass

확인하고 떠있는 헤더 DIV 설정되어 있는지 확인합니다.

자식 요소가 수레와 부모가하지 않는

,이 page 보이는이 반쯤 아래에 대한 문제의 꽤 좋은 설명을 가지고 0

의 높이를 "붕괴"에 대한 부모 요소의 원인 페이지. 당신이 그들을 수레 경우

출처

2011-03-27 16:09:25

나는 [Clearing Floats] (http://www.quirksmode.org/css/clearing.html)가 매우 유용하다는 것을 알게되었습니다. 나는 부모 컨테이너가 뜨는 지 여부가 정말로 중요 하긴하지만 확실하지 않습니다. 부모 컨테이너 자체가 떠 다니는 경우에도 여전히 부동 자식이 포함되어 있지 않습니까? – DavidRR

, 당신은 그들을

솔루션 : 고 1 만들기 위해 릴 CSS의 트릭을 사용할 수 있습니다 : 부모 자동 오버 플로우

<style type="text/css"> 
    .headerWrapper {overflow: auto;} 
    .header {overflow: auto;} 
</stlye> 
<div class='headerWrapper'> 
    <div class='header'> 
     <img..... height=100> 
    </div> 
</div>

솔루션 2 : 사용 clearfix

그들에게 후

<style type="text/css"> 
    .clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;} 
</stlye> 
<div class='headerWrapper clearfix'> 
    <div class='header clearfix'> 
     <img..... height=100> 
    </div> 
</div>

출처

2011-03-27 16:09:56

div를 div에 맞게 세로로 확장합니까?

답변

관련 문제