, 왜 바닥 글은 여기에 그 앞의 내용

-1

겹치지 않는 샘플 HTML입니다 :, 왜 바닥 글은 여기에 그 앞의 내용

<div id = "mainWrapperDiv"> 
    <div id = "mainDiv"> 
     <div> testing </div> 
    </div> 
</div> 
<div id = "footerDiv"> 
</div>

의 CSS : 위치가 상대적으로 설정되어

* 
{ 
    padding:   0px; 
    margin:    0px; 
} 

body, html 
{ 
    height:    100% 
} 

div 
{ 
    border:    none; 
} 

#mainWrapperDiv 
{ 
    min-height:   100%; 
    height:    100%; 
    margin-bottom:  -200px; 
} 

#mainDiv 
{ 

    margin:    0px auto 0px auto; 
    width:    1000px; 
    min-height:   500px; 
    background:   lightgreen; 
} 



#footerDiv 
{ 
    height:    200px; 
    width:    100%; 
    position:   relative; 
    clear:    both; 
    background:   lightblue; 
}

출처

2011-01-21 dave

어떤 끈이 푸터를 사용하고 있습니까? 코드는 어떻게 생겼습니까? 당신은 내가 상대를 꺼내서 여전히 문제가있는

http://www.cssstickyfooter.com/

출처

2011-01-23 17:34:17

그렇습니다. 실제로 사용하는 끈적한 푸터 코드가 있습니다. 웹 페이지를 확대 할 때도 BROWSER WINDOW를 확대하지 않고 div를 겹치면 확대됩니다. – dave

Chrome에서는 발생하지 않습니다. 어떤 브라우저를 사용하고 있습니까? –

괜찮 았니? ie 또는 opera를 시도하고 많은 부분을 확대하면 결국 위의 코드를 사용하여 끈적 인 바닥 글과 다른 div가 겹칩니다. – dave

하기 때문에. 또한 margin-bottom: -200px;

출처

2011-01-21 21:57:12 profitphp

시도 할 수 있습니다. – dave

여백 - 하단 : -200px; 그 중 하나는 아마도 도움이되지 않습니다. – profitphp

예,하지만 페이지 바닥에 꼬리말을 붙이는 방법은 .... – dave

귀하의 margin-bottom은 (은) #mainWrapperDiv입니다. 당신이 그것을 꺼내면 괜찮은 것 같습니다. 그것을 확인하십시오 http://jsfiddle.net/kA6XJ/

출처

2011-01-21 22:46:13

아무 것도 해결하지 못했습니다. – dave

어떤 방법으로 도움이되지 않았습니까? 저에게 녹색이 더 이상 파란색과 겹치지 않는 것처럼 보입니다 ... –

음수 마진을 제거하면 바닥 글이 기본적으로 메인 컨텐츠의 끝 부분에 붙지 않게됩니다. – dave

, 왜 바닥 글은 여기에 그 앞의 내용

답변

관련 문제