2013-09-04 1 views
0

일부웨어 내 필요에 따라 끈끈한 바닥 글을 발견했습니다. 하지만 지금 내가 직면 한 한 가지 문제. 정상 해상도보다 해상도를 높이면 코드가 정상적으로 작동합니다. 컨테이너 div와 바닥 글 div 사이에는 간격이 있습니다. 여기에는 또한 내가 얻은 것과 내가 원하는 것에 대한 화면이 첨부됩니다. enter image description here스티커 바닥 글 높이 문제

이미지마다 (A)와 (B)를 함께 붙여야합니다. 전체 부분이 하나의 단일 항목으로 나타납니다. 여기에도 내 CSS 코드를 추가합니다. 무거운 HTML과 CSS 코드로 인해. JSfiddle을 사용할 수 없습니다. 트위터 부트 스트랩 프레임 워크를 사용합니다.

html { 
     position: relative; 
     min-height: 100%; 
    } 
    body { 
     margin: 0 0 100px; /* bottom = footer height */ 
    } 
    footer { 
     background: none repeat scroll 0 0 #FFFFFF; 
     border-left: 1px solid #E1E1E1; 
     border-right: 1px solid #E1E1E1; 
     border-bottom: 1px solid #E1E1E1; 
     position: absolute; 
     bottom: 0; 
     height: 100px; 
    } 

    #wrap { 
     min-height: 100%; 
     height: auto !important; 
     height: 100%; 
     margin: 0 auto -142px; 
    } 
+0

추가'위치 : 상대;'body 태그 나'wrap'에 부모가 나던 경우 #wrap 늘 어떤 높이를 얻을의 부모 컨테이너 –

+0

@DipeshParmar가 작동하지, 그것의 비활성화 끈적 끈적한 바닥 글 –

+0

경우 신장. 그 때문에 몸에는 높이가 있어야합니다 : html이 아닌 100 %. – Razz

답변

0

완료, 나는 그것을 Jquery를 통해 만들었습니다. 여기에 3 개 블록 하나 개의 블랙 박스 다음 하나의 빨간색 상자가 다시 블랙 박스가 JQuery와 코드 나는 그림에서 볼 수 있듯이

$(document).ready(function(){ 
     $('.contentpartbg').css({height:$(window).height()}); 
    }); 
1

입니다.

나는 C#과 div를 추천 해 드릴 수 있습니다. 귀하의 경우 여기에 개념을 구현하고 구현하십시오.

사례와 마찬가지로 세 개의 div가 있다고 가정 해 보겠습니다. div를 하나씩 차례대로 만들면 "float : left"속성을 따라야하므로 div 옆에 공백이 없으면 div가 차례로 표시됩니다. 이는 div가 블록 요소이기 때문입니다.

동일한 'float : left'속성을 가진 container/div에 모든 div를 넣은 경우에만 다시 작동합니다.

문제가 다시 발생합니다. 여기에 당신은 2 개의 블록을 하나씩 가지고있는 것 같습니다. 그러나 빨간색 컨테이너를 확대하면 많은 공간이 생깁니다.

빨간색 컨테이너의 높이가 너무 높거나 상위 요소의 높이를 상속 한 것 같습니다. 한 번 확인하십시오. 그렇지 않으면 border 속성으로 이동하고 빨간색 요소의 경계를 0px로 만듭니다. 그리고 세 블록 모두에서 float : left 속성을 사용하여 다른 블록 요소에서 공간을 상속받지 않도록합니다. float : left 속성을 가진 단일 블록에 3 개의 블록을 넣을 수 있다면 더 좋을 것입니다.

희망 사항은 귀하의 경우에 적용됩니다.

감사

+0

예 +1이 시도해 볼게요. 대단히 감사합니다. –

+0

안녕하세요. 문제가 있으시면 알려주세요. – sisir

+0

확실한 @sisir .... :) –