가운데 정렬 margin / flex

https://velog.io/@jary/flex%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-%EA%B0%80%EC%9A%B4%EB%8D%B0-%EC%A0%95%EB%A0%AC

[CSS] flex를 이용한 가운데 정렬

margin: 0 auto;

 

근데 이게 안될때도 있어. 

왜 안되는지 잘 모르겠어

 

가장 일반적인 방법은 상위 엘리먼트의 margin값을 0 auto를 주어서 왼쪽과 오른쪽을 자동으로 설정하여 중앙 정렬하는 방법이다.
여기서 단점은 상위 엘리먼트의 width값을 명시를 해주어야 적용이 된다는 것이다. 또한 수평정렬만 가능하다는 점..

 

 

라고 한다.

flex 이용하는 방법도 있더라

display로 가운데 줬는데

앞에가 이상하게 떨어져있길래 

마진이랑 패딩 0 줬더니 깔끔하게 중앙배열됨

 

https://developer.mozilla.org/ko/docs/Web/CSS/flex-direction

flex-direction - CSS: Cascading Style Sheets | MDN

 

이것도 봐라~