1

How do I properly set some of the table cell to display text vertically.

with some help in forums I came up this following idea: http://jsfiddle.net/hr4tkg9q/

I am using the following jquery:

$(document).ready(function () {
    $('td.rotate').css('height', $('td.rotate').width());
});

the problem is, it properly sets the vertical text in 1st column but not the second or third one. will appreciate if you can help.

user1749707
  • 159
  • 14

1 Answers1

-1

try to rotate a div in your cell not the cell. 

<tr>
 <td>    
  <div class='rotate'>
   G
  </div>
 </td>

 ....

UPDATE:

$(document).ready(function () {
  $('tr').each( function() {
    $(this).find('td.rotate').css('height', $(this).find('div.rotate').width());
  });   
});

i think this will help you try this http://jsfiddle.net/hr4tkg9q/2/

Ingo Loos
  • 69
  • 1
  • 4
  • I tried but the height is too small. the height of the cell should be as the size of the cell text: http://jsfiddle.net/hr4tkg9q/2/ – user1749707 Nov 07 '14 at 13:47