css 이미지 수직 정렬

코딩을 하다보면 

간혹 이미지를 수직정렬 하는 문제가 생기곤 하는데

이럴때 사용하면 유용할듯하기도 하고 구글링도 귀찮아서 이곳에 남깁니다.

 

이미지 수직 정렬 방법에는 여러가지가 있는데 

 

첫번째 position 을 이용하는 방법,

두번째는 line-height 를 이용하는 방법,

세번째는 :before / content 를 이용하는 방법,

네번째는 flex를 이용하는 방법이 있습니다.

 

See the Pen Untitled by 진격의 IT (@zsrcvkwa-the-animator) on CodePen.

위 소스를 보고 활용하면 좋을거 같습니다.