팬시 박스 위치 지정 : aboslute 위치 변경을 허용하지 않음

Question

링크를 클릭하면 팝업되는 fancybox가 있습니다. 그것은 중심 지역 주변의 어딘가에서 열리지 만, 중간에있는 것은 아닙니다. fancybox에 대한 CSS는 다음과 같습니다 그러나

#fancybox-wrap { 
    position:absolute; 
    /*padding: 20px;*/ 
    z-index: 1101; 
    outline: none; 
    display: none; 
    margin: 0px auto 0px auto; 
} 

, 내가 position:absolute;이있을 때, 여백 설정이 무효가됩니다. 아무것도 작동하는 것 같습니다. left: 50px; 등은 작동하지 않습니다. 어떤 아이디어?

절대 값을 절대 값으로 변경하면 fancybox가 원하는 위치의 중간에 완벽하게 표시되지만 fancybox는 맨 아래에 거의 보이지 않게 그립니다.

Answer 1

무언가를 절대적으로 배치 할 때 브라우저는 위쪽/아래쪽 및 왼쪽/오른쪽 속성을 기반으로 그려지는 위치를 정확히 알려줍니다.

하여 화면의 중앙에 절대적 위치 : 무관의

#fancybox-wrap { 
    position:absolute; /* want it positioned absolutely relative to parent */ 
    width:500px;  /* fixed width of 500px */ 
    top:50px;   /* 50px down from the top of the screen */ 
    left:50%;   /* positioned in the middle of the screen */ 
    margin-left:-250px;/* use a negative margin of half the fixed width */ 
}