Overriding CSS style in <th> element for a specific column - asp.net

Question

I'm a bit new to CSS/html. I am trying to include this jquery plugin using tablesorter that basically lets your columns sort. It looks to change the class type when the header of the table is clicked on to sort the column in ascending/descending order. I'm trying to follow this tutorial: http://weblogs.asp.net/hajan/archive/2011/02/09/table-sorting-amp-pagination-with-jquery-in-asp-net-mvc.aspx
So in one of my columns, it doesn't make sense to be able to sort since it's all the same. I'm starting with a asp.net/mvc3 application and I'm referring to the last column where you can click on "Details." Since this doesn't change I'd like to not have the up/down arrows in that column. The original css looks like:
table.tablesorter {
font-family:arial;
background-color: #CDCDCD;
margin:10px 0pt 15px;
font-size: 11pt;
width: 100%;
text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 10pt;
padding: 4px;
}
table.tablesorter thead tr .header {
background-image: url(themes/base/images/bg.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter tbody td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
background-image: url(themes/base/images/asc.gif);
}
table.tablesorter thead tr .headerSortDown {
background-image: url(themes/base/images/desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #8dbdd8;
}
So I thought I could add:
table.tablesorter thead .nostyle {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background-color: #8dbdd8;
}
And then in the header I don't want style, do:
<th class="#nostyle"></th>
But that doesn't work. Am I going about this correctly? Or is there a better way? Thanks!

Answer 1

because your class isn't right. class #nostyle does not match .nostyle. .nostyle matches elements with class="nostyle"
<th class="nostyle"></th>

Answer 2

Why not simply disable sorting on those columns?
http://tablesorter.com/docs/#Configuration
Look for the 'headers' setting:
headers Object null An object of instructions for per-column controls in the format: headers: { 0: { option: setting }, ... } For example, to disable sorting on the first two columns of a table: headers: { 0: { sorter: false}, 1: {sorter: false} }

Answer 3

If you used
table.tablesorter thead .nostyle
Your class should be 'nostyle' not '#nostyle' for ex:
<th class="nostyle"></th>