table-layout: fixed CSS nicht richtig mit bestimmten Spaltenbreite

Question

Hier arbeiten ist meine Tabellenstruktur

<table id="recordingsTable" style="width:900px" class="tablesorter fixed_table"> 
</table> 

CSS:

.fixed_table{ 
    table-layout: fixed; 
} 

Bestücken Tabelle aus js:

str = '' 
str += '<thead>' 
str += '<tr>' + 
    '<th style="width:150px;text-align:left !important;border-left:0;">Col 1</th>' + 
    '<th style="width:150px;text-align:center !important">Col 2</th>' + 
    '<th style="width:300px;text-align: center !important;">Col 3</th>' + 
    '<th style="width:100px;text-align: center !important;">Col 4</th>' + 
    '<th style="width:100px;text-align: center !important;">Col 5</th>' + 
    '<th style="width:100px;text-align: center !important;">Col 6</th>' + 
    '</tr>' + 
    '</thead><tbody style="border-bottom: 1px solid #dddddd;">'; 


    for(i=0; i < recording_object.length; i++) { 
     str += '<tr>'; 
     str += '<td style="text-align:left !important; padding-left:8px;border-left:0;">' 
     str += recording_object[i].text 
     str += '</td>' 
     str += '<td class="s3_file_path">' + recording_object[i].path + '</td>' 
     str += '<td class="s3_file_name" style="font-size:11px;">' + recording_object[i].file_name + '</td>' 
     str += '<td>' + recording_object[i].number + '</td>' 
     str += '<td>'; 
     str += '<button id="' + recording_object[i].id + '" onclick="dup_dialog(this)" type="button" data-toggle="modal" ' + 
      'data-target="#upload-all-modal" disabled="disabled" class="btn btn-primary btn-xs">Duplicate</button>' + 
      '</td>' 
     str += "<td>"; 
     str += '<button id="' + recording_object[i].id + '" class="btn btn-primary btn-xs" data-toggle="modal" ' + 
      'disabled="disabled" data-target="#association">Association</button>' 
     str += '</td></tr>' 
    } 
    str += '</tbody>' 

aber Es zeigt nicht die Breite der Tabellenspalte, wie in js definiert, und wenn ich irgendeine Spaltenbreite ändere, ändert sie sich nicht in der Ansicht; auch wenn ich es durch Inspektion Element

ändern scheint es, dass Tabelle-Layout nicht ordnungsgemäß funktioniert, da es jede Spaltenbreite wie angegeben zuweisen sollte. Kann jemand helfen? Hier

ist Tabelle Screenshot:

Answer 1

Alles, was ich sehe, ist ein Problem mit thead .Sie vergessen zu it.I einige zufällige data.I zu öffnen setzen auch die Polsterungen in Ihrer Zellen.Verfahren Breite entfernt wird genau wie Sie spezifizieren es in Javascript. Überprüfen Sie die Geige.

https://jsfiddle.net/ks3mj4ec/4/