상대 및 절대 위치 지정

상대 위치 div 내에있는 절대 위치 지정 div 다음에 내용을 배치 할 수 있는지 이해하려고합니다. 나는 상대적으로 위치 div의 높이를 모르는 경우. 기본적으로상대 및 절대 위치 지정

, 나는 실제이없는,이 동적이기 때문에이 구성이 ...

<div style="position:relative"> 
    <div style="position:absolute; top:0; left:100;"> 
    <div style="position:absolute; top:100; left:100;"> 
<div>

(... 그리고 여기에 내용을 배치하고 싶습니다)이 상대적 div의 높이. 그래서 나는이 컨테이너의 CSS 안에 배치 할 수 없다.

나는 무엇을하려고하는지 설명하기 위해 jsfiddle (http://jsfiddle.net/o7k2dpdz/)을 만들었습니다. 인공 높이 500px를 높이로두고 왔지만 이것을 제거하고 가능하다면 여전히 작동하도록하고 싶습니다.

출처

2015-01-20 Charles Sounder

어떤 종류의 콘텐츠입니까? – Slime

아니요. 높이를 사용해야합니다. 그렇지 않으면 절대 div가 표시 되더라도 배경이 전체 컨테이너에 나타나지 않습니다. 괜찮습니까? –

텍스트 콘텐츠. –

난 이런 종류의 레이아웃에 position:absolute; 접근 방식을 사용할 필요가 없다고 생각합니다. 여기

이 당신이 만들 의도입니다 내가

jsFiddle

희망 절대 위치없이 솔루션의 예입니다.

출처

2015-01-20 13:27:19 dimshik

매우 똑똑한 딤식 (Dimshik)이지만, 제 경우에는 절대적인 포지셔닝이 필요합니다. 저는 가장 짧은 컬럼 접근법을 사용하여 객체를 배치하고 있습니다. 나는 이것을 자바 스크립트를 사용하여 해결할 수 있었다. 가장 큰 열을 계산하고 컨테이너 높이로이 px 측정 값을 사용합니다. 당신의 도움을 주셔서 감사합니다. –

위의 내용은 하나의 열을 보여 주지만 더 큰 응용 프로그램에는 나와 있습니다. 나는 몇 가지를 사용하고있다. –

상대 및 절대 위치 지정

답변

관련 문제