vertical-align

vertical-align

1. inline 또는 table-cell 박스에서의 수직정렬하게 해준다
2. 보통 이미지와 텍스트를 같은 요소에서 중앙으로 배치하도록 많이 사용된다
3. 텍스트 요소에는 line-height 을 주고, img 태그에는 vertical-align: top 을 주면 원하는 대로 구현이 가능하다

img {
	width: 20px;
    height: 20px;
    verticle-align: top;
}

span {
	line-height: 20px;
}

table-cell 요소

display: table 을 사용한 요소는 <table> 요소처럼 보이고
display: table-cell을 사용한 요소는 <td> 요소처럼 보인다