폭, 즉

에서 회전 작동하지 않습니다 나는이 (크롬, 오페라, FF에서) 다음과 같습니다 일부 테이블 :
enter image description here 폭, 즉

하지만 IE는 (7, 8, 9) 브라우저는이 테이블을 표시합니다 like :
IE browser

질문 : 열 너비를 조정하는 방법은 무엇입니까?

나는 두 CSS 클래스를 가지고 TD 태그를 들어 TD 태그 내에 위치

.td__vertical{ 
     text-align:center; 
     vertical-align:bottom; 
     border: 1px double #8EB340 ; 
     font-size:11px; 
     color:#666; 
     background-color: #F0F4E7; 
     padding: 0px 0px 20px 0px; 
     margin: 0px 0px 0px 0px; 
     width:30px; 
}

및 DIV위한

는 :

<td class="td__vertical"><div class="rotated" >Column2 Column2 Col..</div></td>

.rotated{ 
     transform: rotate(-90deg); 
     -webkit-transform: rotate(-90deg); 
     -moz-transform: rotate(-90deg); 
     -o-transform-origin:  0 0; 
     -o-transform: rotate(-90deg); 
     filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 
     -ms-transform: rotate(-90deg); 
     white-space: nowrap; 
     width: 30px; 
}

정도로 열은 다음과 같이 설명

Chrome, Opera, FF에서 반응 : "너비 : 30px;" "rotate"클래스에서 "width"와 "td__vertical"에서 "width"는 중요하지 않습니다. 그러나 IE는 그 중 어느 것도 사용하지 않았습니다. "행렬"을 통한 회전은 같은 효과를냅니다.

UPD : 필자는 열 너비가 텍스트의 너비, 즉 회전되지 않은 상태의 텍스트 너비라는 것을 살펴 보았습니다. 그렇다면 열의 너비를 자동으로 조절하지 않으려면 어떻게해야합니까? 당신은 텍스트가 다음 쓰기 모드로 사용할 수 있습니다 위에서 아래로 읽어 IE에서 그 상관하지 않는 경우

출처

2012-11-07 Kristina Kurshakova

스피 당신이 적절한 문서 타입 –

을 사용하는 것을 나는 –

시도'' –