이동 된 div가 여전히 원래 공간을 차지합니까?

내 웹 사이트에서 div가 중첩되어 있습니다. 코드를 사용하면 다음과 같이 바뀝니다.이동 된 div가 여전히 원래 공간을 차지합니까?

float:left; 
    position:relative; 
    top: 5em; 
    left: -4em; 
    margin-left: auto; 
    margin-right: auto;

따라서 웹 사이트가로드 될 때 모든 것이 올바른 위치에 있습니다. 그러나 다른 콘텐츠는 div USED가되는 위치에 의해 영향을받습니다. 어느 쪽이, 나는 단지 "유령 div"로 참조 할 것입니다

나는 이것이 일반적인 문제라고 확신하지만 올바른 문구를 찾을 수 없었으므로 제대로 문구를 쓰는 방법을 모릅니다.

예 : Ghost Div

출처

2011-02-04 Johannes

링크가 있습니까? – yoda

죄송합니다 yoda, 전 로컬 근무하고 있습니다. 코드는별로 길지 않습니다 (방금 시작했습니다). 원한다면 게시하는 것이 더 행복 할 것 같습니다. – Johannes

정확히 내 컴퓨터에서 HTTP 서버를 실행합니다. HTTP 서버없이 실행하는 것은 싫지만 로컬 파일에는 항상 이상한 제한이 있습니다. –

정확히 위치입니다 : 상대; 할 예정이다. 요소를 레이아웃에 참여시키지 않으려면 position : absolute를 사용하십시오. 대신. 부모 중 하나를 위치 요소로 지정하여 다른 요소에 상대적으로 만들 수 있습니다 (예 : 좌표를 사용하지 않고 position : relative를 적용하여).

출처

2011-02-04 01:52:05

와우, 팁 주셔서 감사합니다. 저는 친척이 "공간"을 지키고 절대적으로 그렇지 않다는 것을 결코 알지 못했습니다! – Johannes

그렇지 않으면 상대적인 위치를 유지하고 음수 여백을 사용하십시오. 이것이 사실 일지 모르겠다면 .. – Lucius

Matti가 맞습니다.

하는 컨테이너 요소의 위치 확인 : 상대를 (하지만 아무 상단/왼쪽/오른쪽/하단을 넣어하지 않음) 당신이있어이 요소를 확인

또한, 당신이 아마하고 싶은 것은 이것이다 움직이기 : 위치 : 절대;

그러면 요소의 좌표가 컨테이너 요소를 기준으로 설정됩니다.

"컨테이너"요소를 말하면, 이동하려는 요소를 감싸는 요소가 무엇이든간에 말입니다.

그래서 만약 당신의 HTML 코드는 다음과 같다 : 그런

#header { position: relative; } 
#header #weird-symbol { position: absolute; left: -200px; top: 30px; }

또는 무언가 :

는

<div id="header"> 
    <div id="weird-symbol"><img src="/symbo.gif" /></div> 
    .. some other stuff .. 
</div>

그런 다음 CSS 같은 것을해야한다.

희망 하시겠습니까?

출처

2011-02-04 02:01:36 arnorhs

예제를 제공해 주셔서 감사합니다! – Johannes

이동 된 div가 여전히 원래 공간을 차지합니까?

답변

관련 문제