How to set column widths to a jQuery datatable?

Question

I have a jQuery datatable(outlined in red), but what happens is that the table jumps out of the width I have set for the div(which is 650 px).

Here is the screen shot

Answer 1

by using css we can easily add width to the column.

here im adding first column width to 300px on header (thead)

::ng-deep  table thead tr:last-child th:nth-child(1) {
    width: 300px!important;
}

now add same width to tbody first column by,

  

            

            

                
name
            
            
            

           
            

                
jhon mathew
                
            
            
        
       

by this way you can easily change width by changing the order of nth child. if you want 3 column then ,add nth-child(3)