[CSS] Modal을 화면 중앙에 배치하기

개발을 하다 보면 모달창을 자주 사용하게 된다. 모달창은 보통 화면에 한가운데에 위치하게 되는데 이를 라이징 테스트에서 원티드를 클론코딩하며 내가 겪었던 과정과 함께 기술하겠다. 원티드에서는 대표적으로 로그인 및 회원가입에서 모달이 필요한데, 우선 가장 쉽게 떠올렸던 방법은 모달의 width와 height를 고정값으로 정했다. width: 500px; height: 500px; top: calc(50% - 250px); left: calc(50% - 250px); 위와 같이 화면 중앙에 모달을 배치했었다. 그러나 모달마다 크기가 다르기 때문에 이는 분명한 한계점이 있다. 그래서 생각한 방법은 width는 고정값을 주고, height를 다르게 받았다. left: `calc(50% - ${width / 2}..

원문링크 : [CSS] Modal을 화면 중앙에 배치하기