Search code examples
jquerycsstablesorter

jQuery tablesorter display all th elements in a column

Tablesorter is working fine, but all th elements are displayed in a column one under another instead of normal way of displaying in a row. Only IE display them right :)

Here's the link: http://jsfiddle.net/cmMvF/2/

When I remove tablesorter script, table is displayed correct. I have no additional classes on tables except tablesorter demo blue theme. My table head part is simple:

<table id='catalog_model_line' width='100%' class='tablesorter'>
    <thead>
      <tr>
        <th class="header headerSortDown">Модельный ряд</th>
        <th class="header">Кузов</th>
        <th class="header">Дата выпуска</th>
     </tr>
    </thead>
..................

What to do in such situation?

Solution

  • problem is tablesorter adds class header to TH. This conflicts with your main page css rule for .header that sets width to 100%. Can see this quickly in browser console. Adding rule for .tablesorter .header should fix it