높이가 100 %로 이동하지 않습니다.

왼쪽에 결과가 있고 오른쪽에 html> wrapper> container가 있습니다.높이가 100 %로 이동하지 않습니다.

이제이 두 가지 높이가 수정되지 않고 내용에 따라 100 %로 늘어나기를 원합니다. 어떤 경우에는 결과가 주보다 길고 그 반대도 마찬가지입니다. 저는 100 % 높이를 사용했지만 작동하지 않는 것 같습니다. 도와주세요!

html, body { 
margin: 0; 
padding: 0; 
height: 100%; 
} 

#wrapper { 
min-height: 100%; 
position: relative; 
width: 100%; 
} 

#container { 
width: 1007px; 
padding: 130px 0 0 0; 
display: block; 
} 

.results { 
width: 383px; 
float: left; 
background: 
#fff; 
display: block; 
-webkit-box-shadow: -2px 0px 8px -6px #000; 
-moz-box-shadow: -2px 0px 8px -6px #000; 
box-shadow: -2px 0px 8px -6px #000; 
padding-bottom: 60px; 
} 

.main { 
width: 606px; 
float: left; 
padding: 15px 0 0 16px; 
position: relative; 
background: url(images/pattern.png) repeat; 
height: 100%; 
bottom: 0px; 
} 

<html lang="en> 
    <head></head> 
    <body> 
    <div id="wrapper"> 
     <div id="container" class="clear fix"> 
      <section class="results"> 
      </section> 
      <section class="main"> 
      </section> 
     </div> 
    </div> 
    </body> 
    </html>

출처

2013-04-09 user1038814

HTML도 게시하십시오. – dfsq

두 열이 같은 크기가되기를 원하십니까? 그렇다면'overflow : auto'을'# Wrapper'에 추가하십시오. – Justin

position 속성에서 "relative"대신 "absolute"를 사용하십시오. 나는 여기에서 일했고 일했다. 예를 들어

.main { 
width: 606px; 
float: left; 
padding: 15px 0 0 16px; 
position: absolute; 
background: url(images/pattern.png) repeat; 
height: 100%; 
bottom: 0px; 
}

포옹 비니.

출처

2013-04-09 17:54:59

안녕 Vinicus, 고맙습니다.하지만 제가 그렇게한다면, 주요 섹션은 결과 섹션 위에 있습니다. ( – user1038814

솔직히 말하면, 이 방법으로 높이 속성을 "강제 적용"하는 방법이 있다면 div의 100 %를 할 수있는 이유는 무엇입니까? 요소를 더 잘 맞출 수 있도록 페이지 디자인을 검토하십시오. –

대부분의 경우 높이가 100 %라고되어 있지만 "100 % 무엇을?"라는 질문을해야 할 때 문제가 발생합니다. 그 대답은 그 요소의 부모입니다. 그래서 다음 질문은 "부모의 높이를 어떻게 설정합니까?"입니다. 부모에게 높이를 설정하지 않은 경우 아무것도없는 것의 100 %가 아무것도 아닙니다.

출처

2013-04-09 17:57:21 Rob

높이가 100 %로 이동하지 않습니다.

답변

관련 문제