css) 가운데 맞추는 공식 position, display: flex

 

1. 부모div > 자식div 로 만든 버튼 전체 위치 조정

부모에 position: relative; 이렇게 해서 위치의 기준을 이 속성을 준 태그로 한다.

 

자식 div

position: absolute;

 

부모의 세로 중심선에, 자기 자신을 딱 가운데로 맞추는 공식

top: calc(50% - 25px)  => calc(50% - 요소 높이의 절반)

 

2. div안 버튼 표시 위치 조정

버튼을 ' > ' 표시가 처음엔 한쪽에 쏠려있었다

 

 

 

  display: flex;
  align-items: center;
  justify-content: center;
이 세줄은 공식이다.