vertical-align

수직정렬

1. inline이나 inline-block 요소에서만 적용됨

   (<div>는 block 속성이라 적용 안됨!)

 

2. 요소 자체만을 정렬하고, 내용에는 영향을 미치지 않는다.

   (table cell에 적용할때는 예외: 내용에 영향을 미친다.)

 

3. 정렬하려는 요소를 다른 인라인 요소에 상대적으로 정렬함

같은 줄에서 인라인 요소의 크기에 따라 높낮이가 달라질 수 있고, 

그 줄에 있는 line-height 설정에 따라서도 달라질 수 있음(무슨 말인지 모르겠어..)

 

 

적용하기

1.

<div class="a">
	<div class="b">
    </div>
</div>

.a{
display: table;
height: ;
}
.b{
display: table-cell;
vertical-align:middle;
}