Div 확장 컨테이너의 길이

왼쪽 사이드 바를 확장하여 페이지 (또는 컨테이너 DIV)의 길이에 걸쳐 확장하려고합니다. 컨테이너의 높이를 100 %로 설정하고 사이드 바 높이를 100 %로 설정하려고 시도했지만 작동하지 않았습니다.Div 확장 컨테이너의 길이

여기 내 코드입니다 :

div#container 
{ 
overflow: hidden; 
margin-left: auto; 
margin-right: auto; 
margin-top: 0px;  
padding-bottom: 10px; 
width: 880px; 
height: 100%; 
text-align: left; 
} 

div#left 
{ 
float: left; 
width: 280px; 
height: 100%; 
padding: 4px; 
background: #F1D7A5; 
}

그리고 여기에 같은 페이지 모습입니다 : http://www.studentbridges.org/new/이

가 나는 사이드를 확장 할 수있는 방법에 대한 입력이 크게 감사하겠습니다!

감사합니다. 100 % 높이를 설정 ~ 노 엘레

출처

2012-07-27 nellygrl

보통이 문제는 사이드 바의 컨테이너에 이미지로 사이드 바의 배경을 넣고 y 축을 따라 반복하여 해결합니다. 이것은 실제로 사이드 바를 strectch하지 않지만, 똑같이 보입니다. 귀하의 경우에는 당신은 그냥 지금처럼, 그것은 높이 880px 폭을 1 픽셀의 수 자르기 페이지의 PRINTSCREEN을하고 #container의 배경으로 설정 수 :

background: url(<path_to_image>) repeat-y center;

또한 배경을 제거 할 수 있습니다 #left에서. 테이블 사용을 피하기위한 모든 것!

출처

2012-07-29 00:26:57 Pevara

컨테이너의 높이를 제한합니다. 컨테이너를 원하는 픽셀 높이로 설정하면 하위 div가 높이를 확장하여 일치시킵니다. 하위 div는 컨테이너의 하위 div이므로 height : 100 %는 컨테이너 div에 남아있는 나머지 길이 만 나타납니다.

출처

2012-07-27 20:05:00 Austin

그러나 컨테이너에는 누군가보고있는 페이지를 기반으로하는 가변 길이가 있습니다. 사이드 바가 100 %로 설정되어 있어도 여전히 컨테이너는 siebar보다 길다. 아마도 나는 너를 이해하지 못한다. – nellygrl

당신의 #left div는 #container에 직접 들어 있지 않고, #container 안에 #contbg 안에 있고 #contbg는 #header에 의해 #container의 어떤 공간이 차지하고 있는지 만 주어진다. – Austin

오. 100 %로 설정하면 페이지 아래로 확장 될 거라고 생각했습니다. 나는 그렇지 않다. 어떻게 해결할 수 있는지 알고 계십니까? 아니면 그냥 운이 좋았을 까? – nellygrl

Div 확장 컨테이너의 길이

답변

관련 문제