메신저 팝업 div를 상단 및 왼쪽 속성을 사용하여 화면 중앙에 정렬하려고합니다. 나는이 두 속성에 % 값을 부여하는 것이 좋을 것이라고 생각하여 브라우저 창 크기를 조정하더라도 팝업이 중앙에 배치되도록했습니다.CSS 상단 및 왼쪽 백분율 값은 화면 해상도에 따라 좌우됩니까?
하지만 실제로 브라우저 창 크기를 조정하면 예상대로되지 않습니다.
내 왼쪽 상단 속성에 대해 지정한 % 값이 화면 해상도에 달려 있습니까? 아니면 부모 컨테이너의 크기에 의존합니까?
가능성이 있습니다. 비율은 요소를 포함하는 모든 요소에 상대적입니다. 그 요소가 창 자체 일 경우, 예, 해상도와 관련이 있습니다. 실제로 부모가하는 한 항상 화면 해상도에 의존합니다. 그리고 부모의 부모에게도 마찬가지입니다. 이해하기 힘든 것.
기본적으로 사물 계층 구조에있는 요소 위의 요소가 이 아닌 경우은 해상도에 따라 다르며 요소도 마찬가지입니다. 그러나 그것이 상위인지 여부가 해상도에 달려 있는지 확인하려면 에서 요소의 상위를 찾아야합니다. 그 후 부모님. 그리고 그 위로 가기까지. 아니면 당신이 그것을 테스트하고 볼 수 :)
그것은 "계층"에서 어딘가에 절대 위치/크기 요소가있어, 그때 가능성이있다 화면 해상도에 의존하지 않습니다.
%는 다음 상대적인 상위 컨테이너의 크기에 따라 다릅니다.
비율은 부모의 크기에 달려 있습니다. 여기를 참조하십시오 : http://jsfiddle.net/tqWhL/4/ 빨간색 div는 #a만큼 넓습니다. body 이후
가 브라우저 창 폭의 100 %, 당신은 body의 자녀가 당신의 사업부을 100 % 폭으로 설정할 수 있습니다.
내 팝업 크기를 브라우저 창에 직접 표시하려면 본문 태그의 직접적인 자손으로 두어야합니다. 맞습니까? – Ivin
@Orbb eh..kinda. 그러면 가끔씩 작동하지만 몸체가 창 (예 : 스크롤 막대)보다 큰 경우에는 작동하지 않습니다. 대신 jQuery를 사용하여 창 높이와 너비를 얻고 크기를 지정하는 데 사용합니다. 또한 윈도우에 resize 이벤트를 추가하고 요소의 크기를 업데이트하는 것이 좋습니다. –
그 jQuery 팁 필립에게 감사드립니다. 좋은 생각. +1 :) – Ivin