CODEWITHSUNDEEP
jquerydatatables
blue-sky
blue-sky

Reputation: 53826

Datatables width not being set correctly

When I try and set the datatable width just the table main section is being resized , in attached image the red circled element should be aligned with main html table. :

enter image description here

To center the table I use : $("#myDataTable").css("width","80%"); but as you can see it just resizes the main table section, not the entire datatable.

Upvotes: 1

Views: 13898

Answers (3)

Geoff Rowell
Geoff Rowell

Reputation: 1

Base the wrapper width on the content table's width:

$('#<tableid>_wrapper').bind('DOMSubtreeModified', function () {
  $(this).css('width', $('#<tableid>').css('width'));
});

Upvotes: 0

user2464844
user2464844

Reputation: 1

Best solution i have come up with thus far:

$('#[datatable-id]_wrapper').bind('DOMSubtreeModified', function() {
    $(this).css('width', '150px');
    $(this).css('height', '250px');
});

Seems to handle most use cases.

Upvotes: 0

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76880

datatables creates a wrapper element which has always the class dataTables_wrapper so if you want to resize the table you should resize that element

$(".dataTables_wrapper").css("width","80%");

if you have more than one table and you want to target a specific wrapper, the id of that wrapper is 

$("#idofyourtable_wrapper").css("width","80%");

Upvotes: 9

Related Questions