2011-04-10 5 views
0

두 절대 위치 요소가 있습니다. 그들은 왼쪽과 오른쪽을 사용하기 때문에 절대적으로 배치해야합니다. 위쪽도 위쪽을 사용하고, 아래쪽은 여백을 가지지 않으므로 아래로 스크롤 한 후 브라우저 창 아래쪽에 "연결"됩니다. 상단의 경우 필자는 원하는 스타일을 유지하기 위해 최소 높이를 사용하고 동적 인 내용이나 작은 디스플레이 때문에 필요할 때 확장하지 못하도록 방지하지 않습니다. 하위 요소가 항상 위쪽 요소 아래에 있는지 확인하려면 어떻게해야합니까?absulte 위치 요소를 다른 요소 아래 놓습니다.

javascript없이 작동하는 솔루션을 찾고 있습니다.

+0

좋아, 당신은 귀하의 게시물을 수정, 그래서 낮은 하나는 항상 브라우저 창 하단에 결합되어야한다), 당신이 당신이 필요로하는 것입니다

#content { margin-left: -50px; } 

희망 사용할 수 있을까? –

답변

2

두 개의 요소를 header-div 및 content-div라고합니다. 주위에 배치 div를 추가하십시오. 귀하의 HTML은 다음과 같아야합니다 : 최소 높이를 설정,

#wrapper { 
    position: absolute; 
    top: yourvalue; 
    left: yourvalue; 
    right: yourvalue; 
} 

그리고 헤더에 대한 몇 가지 스타일을 추가 :

<div id="wrapper"> 
    <div id="header"> 
    </div> 

    <div id="header"> 
    </div> 
</div> 

이제 절대적으로 당신의 헤더 사업부의 값을 사용하여 wrapper 위치 : 당신이 원하는 방법 헤더 left: 350px; 및 콘텐츠를 갖게 할 필요가있는 경우는

#header { 
    min-height: yourvalue; 
} 

이제 예를 들어, 위치를, 내용에 여백을 사용할 수 0,123,979

관련 문제