Ordina tabella (sortable)

[pennaverde]

Ciao a tutti, innanzitutto complimenti per il forum e per html.it, sito che più di una volta mi è tornato molto utile per i tutorial e gli script pronti
anyway, l'altro giorno ho iniziato a cercare come mettere una tabella dove l'utente può cliccare sugli head della tabella e che li riordini per nome, prezzo, ecc...
ho trovato questo:
http://javascript.html.it/script/ved...rdina-tabella/
che è un fantastico script con una bellissima interfaccia grafica, il problema è che non trovo come ridimensionare le colonne, ho cercato di capire dagli script ma ho iniziato da poco javascript, anche se passare da c# script non c'è tutta sta differenza ho sentito dire,ad ogni modo non riesco a estrapolare la soluzione, mentre il css c'è l'ho in lista tra le cose da imparare
vi posto i codici nel caso che possano servire:

questo è il file script.js

var TINY={}; function T$(i){return document.getElementById(i)} function T$$(e,p){return p.getElementsByTagName(e)} TINY.table=function(){ function sorter(n){this.n=n; this.pagesize=20; this.paginate=0} sorter.prototype.init=function(e,f){ var t=ge(e), i=0; this.e=e; this.l=t.r.length; t.a=[]; t.h=T$$('thead',T$(e))[0].rows[0]; t.w=t.h.cells.length; for(i;i<t.w;i++){ var c=t.h.cells[i]; if(c.className!='nosort'){ c.className=this.head; c.onclick=new Function(this.n+'.wk(this.cellIndex)') } } for(i=0;i<this.l;i++){t.a[i]={}} if(f!=null){var a=new Function(this.n+'.wk('+f+')'); a()} if(this.paginate){this.g=1; this.pages()} }; sorter.prototype.wk=function(y){ var t=ge(this.e), x=t.h.cells[y], i=0; for(i;i<this.l;i++){ t.a[i].o=i; var v=t.r[i].cells[y]; t.r[i].style.display=''; while(v.hasChildNodes()){v=v.firstChild} t.a[i].v=v.nodeValue?v.nodeValue:'' } for(i=0;i<t.w;i++){var c=t.h.cells[i]; if(c.className!='nosort'){c.className=this.head}} if(t.p==y){t.a.reverse(); x.className=t.d?this.asc:this.desc; t.d=t.d?0:1} else{t.p=y; t.a.sort(cp); t.d=0; x.className=this.asc} var n=document.createElement('tbody'); for(i=0;i<this.l;i++){ var r=t.r[t.a[i].o].cloneNode(true); n.appendChild(r); r.className=i%2==0?this.even:this.odd; var cells=T$$('td',r); for(var z=0;z<t.w;z++){cells[z].className=y==z?i%2==0?this.evensel:this.oddsel:''} } t.replaceChild(n,t.b); if(this.paginate){this.size(this.pagesize)} }; sorter.prototype.page=function(s){ var t=ge(this.e), i=0, l=s+parseInt(this.pagesize); if(this.currentid&&this.limitid){T$(this.currentid).innerHTML=this.g} for(i;i<this.l;i++){t.r[i].style.display=i>=s&&i<l?'':'none'} }; sorter.prototype.move=function(d,m){ var s=d==1?(m?this.d:this.g+1):(m?1:this.g-1); if(s<=this.d&&s>0){this.g=s; this.page((s-1)*this.pagesize)} }; sorter.prototype.size=function(s){ this.pagesize=s; this.g=1; this.pages(); this.page(0); if(this.currentid&&this.limitid){T$(this.limitid).innerHTML=this.d} }; sorter.prototype.pages=function(){this.d=Math.ceil(this.l/this.pagesize)}; function ge(e){var t=T$(e); t.b=T$$('tbody',t)[0]; t.r=t.b.rows; return t}; function cp(f,c){ var g,h; f=g=f.v.toLowerCase(), c=h=c.v.toLowerCase(); var i=parseFloat(f.replace(/(\$|\,)/g,'')), n=parseFloat(c.replace(/(\$|\,)/g,'')); if(!isNaN(i)&&!isNaN(n)){g=i,h=n} i=Date.parse(f); n=Date.parse(c); if(!isNaN(i)&&!isNaN(n)){g=i; h=n} return g>h?1:(g<h?-1:0) }; return{sorter:sorter} }();

ecco il style.css

* {margin:0; padding:0; outline:none} body {font:10px Verdana,Arial; margin:25px; background:#fff url(images/bg.gif) repeat-x; color:#091f30} .sortable {width:980px; border-left:1px solid #c6d5e1; border-top:1px solid #c6d5e1; border-bottom:none; margin:0 auto 15px} .sortable th {background:url(images/header-bg.gif); text-align:left; color:#cfdce7; border:1px solid #fff; border-right:none} .sortable th h3 {font-size:10px; padding:6px 8px 8px} .sortable td {padding:4px 6px 6px; border-bottom:1px solid #c6d5e1; border-right:1px solid #c6d5e1} .sortable .head h3 {background:url(images/sort.gif) 7px center no-repeat; cursor:pointer; padding-left:18px} .sortable .desc, .sortable .asc {background:url(images/header-selected-bg.gif)} .sortable .desc h3 {background:url(images/desc.gif) 7px center no-repeat; cursor:pointer; padding-left:18px} .sortable .asc h3 {background:url(images/asc.gif) 7px center no-repeat; cursor:pointer; padding-left:18px} .sortable .head:hover, .sortable .desc:hover, .sortable .asc:hover {color:#fff} .sortable .evenrow td {background:#fff} .sortable .oddrow td {background:#ecf2f6} .sortable td.evenselected {background:#ecf2f6} .sortable td.oddselected {background:#dce6ee} #controls {width:980px; margin:0 auto; height:20px} #perpage {float:left; width:200px} #perpage select {float:left; font-size:11px} #perpage span {float:left; margin:2px 0 0 5px} #navigation {float:left; width:580px; text-align:center} #navigation img {cursor:pointer} #text {float:left; width:200px; text-align:right; margin-top:2px}

ho cercato un po' per google e un po' per il forum ma non ho trovato risposta per questo script, per quanto riguarda la ricerca nel forum ho trovato questo:

http://forum.html.it/forum/showthread/t-1427008.html

ringrazio in anticipo

[cavicchiandrea]

Ma hai provato a lavorare sui css?

[pennaverde]

ho provato a aprire tutti e 3 i codici sorgente alla ricerca di un qualche valore in pixel ho qualcosa del genere,ma li ho trovati solo nel css non avendo la minima idea di come editarli...