title: Vertically rotate text inside an HTML table header cell
body: <p>I am using the following css to rotate the text inside table header cells but the header cells is of the same width as if the text were horizontal.How can I just rotate the text and the width will reduce automatically..</p>
  
  <pre><code>    table#MyTable tr th a{
      color: #FFFFFF;
      display: block;
      /*Firefox*/
      -moz-transform: rotate(-90deg);
      /*Safari*/
      -webkit-transform: rotate(-90deg);
      /*Opera*/
      -o-transform: rotate(-90deg);
      /*IE*/
      writing-mode: tb-rl;
      filter: flipv fliph;
      padding: 60px 1px;
  }
  </code></pre>