html #css1 Modal 창 현재 Html 화면 가운데 위치 시키기 .modal_frame { position: fixed; # .modal_fram 속성을 가진 요소를 현재 보고있는 창을 기준으로 고정, 스크롤되어도 따라다님 left: 50%; # 보고 있는 화면 (= 뷰 포트, position이 fixed 이므로) 가로 선 중앙 50%로 이동 top: 50%; # 보고 있는 화면 세로 선 중앙 50% 이동 transform: translate(-50%, -50%); # 요소를 수직 및 수평으로 -50% 만큼 이동 > 최종적으로 화면 정 중앙에 위치 } 위의 코드를 본 후에 top 50%, left 50% 후 각각 tranfrom -50%을 적용하는 대신 각 수치에 100%, -100%를 적용해도 같은 효과를 보일 것이라고 생각하고, 테스트 해봤다. 테스트 해 본 결과.. 2023. 3. 24. 이전 1 다음