센터는 절대 위치

Question

position: relative;과 margin:auto;을 사용하여 div로 중심을 정렬하는 방법을 알고 있지만 다른 div 앞에 모두있는 div가 있습니다. 따라서 z-index: 1000;과 position:absolute;을 설정합니다. 나는 이것을 상대방에게 시도하면 position: absolute;없이 이것을 앞에 놓는 다른 방법을 찾아 낼 수 없다. 내 질문은 z-index: 1000; position: absolute; 센터에 머물고있는이 div를 어떻게 설정합니까?

나는 완벽 해 보이지만 더 큰 화면이나 훨씬 작은 스크린에 표시 될 때 그 비율은 동일하지 않을 것입니다.

Answer 1

당신은 두 가지 중 하나를 수행 할 수

1. 는 고정 %의 폭을 제공하고 센터에 수학을 :

position:absolute;width:60%;left:20% (100%-60% = 40% ->40%/2 = 20%)

2. position:absolute;text-align:center;을 사용하여 div를 배치하고 내부 요소를 지정하십시오. position:relative;display:inline-block;

Answer 2

position:relative div에는 여전히 z-index을 사용할 수 있습니다. 다른 모든 z-index 객체도 선언 된 위치를 가져야합니다.

Answer 3

div의 너비와 높이가 50 %이고 위치 여백의 절반이 음수 여야합니다. 예 : div 100px x 100px :

z-index: 1000; 
position: absolute; 

top: 50%; 
left: 50%; 
margin-left: -50px; 
margin-top: -50px;