세로 맞춤 텍스트 배열

Question

나는 다양한 길이의 세로 페이지 레이블, 즉 뉴스, 수상 경력, 출판물을 보유하고 있습니다. 나는 텍스트가 같은 최상위 지점에서 시작하고 싶다. (텍스트가 수평 인 경우, 오른쪽으로 맞출 수있다.) 그 지점에서 내려 간다. 올바른 위치에 텍스트를 밀어 넣으려면 인라인 스타일을 사용해야합니다. 나는 높이와 너비를 500으로 설정하려고 시도했는데, 이는 정렬을 위해 작동하는 것처럼 보이지만 div를 바른 길로 밀었습니다.

.vert_text { 
position: relative; 
color: #fff; 
text-transform: lowercase; 
font-family: Arial; 
font-size: 6em; 
-webkit-transform: rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-ms-transform:rotate(-90deg); 
float:left; 
width:100px; 
} 

<div class="vert_text"> 
news 
</div> 
<div class="vert_text"> 
publications 
</div> 

Answer 1

를 사용하여 라인 높이 예를 들어 높이를 정의

.vert_text { 
    height:6em; 
    line-height:6em; 
} 

는이 fiddle 작업을 참조하십시오.

Answer 2

.var_text{ 
margin-top:0px; 
} 

또는

삭제 위치 :

상대가 다음 추가

여백 : 0 픽셀 또는 여백 - 상단 : 0 픽셀;