Material-table: How can I remove x-overflow in the table and make columns of the fixed size?

[Leocete]

Hi all, I'm trying to create a table with nine columns on the half on the page and set them a fixed width in hope that table will fit a container:

  const tableColumns = [
    { title: 'First field', field: 'commodityCode', cellStyle: { width: '10%'}, width: '10%', headerStyle: { width: '10%'} },
    { title: 'Second field', field: 'name', width: '10%', cellStyle: { width: '10%'}, headerStyle: { width: '10%'} },
    { title: 'Third field', field: 'customsStatus', width: '20%', cellStyle: { width: '20%'}, headerStyle: { width: '20%'} },
    { title: 'Fourth field', field: 'planQty', width: '10%', cellStyle: { width: '10%'}, headerStyle: { width: '10%'} },
    { title: 'Fifth field', field: 'origin', width: '5%', cellStyle: { width: '5%'}, headerStyle: { width: '5%'} },
    { title: 'Sixth field', field: 'uom', width: '5%', cellStyle: { width: '5%'}, headerStyle: { width: '5%'} },
    { title: 'Seventh field', field: 'incomingProcess', width: '10%', cellStyle: { width: '10%'}, headerStyle: { width: '10%'} },
    { title: 'Eight field', field: 'customsDocument', width: '17%', cellStyle: { width: '17%'}, headerStyle: { width: '17%'} },
    { title: 'Ninth field', field: 'action', width: '13%', cellStyle: { width: '13%'}, headerStyle: { width: '13%'} }
  ];

I've tried all the variants (width width, cellStyle and headerStyle), but none of them worked.
I still receive a table with columns of the same size and x-overflow scroll.
Are there any solutions to how this could be fixed?

Sandbox: https://codesandbox.io/s/material-table-change-width-of-column-4sbvf?fontsize=14&hidenavigation=1&theme=dark&file=/src/index.js

This is the example on how it looks like:

[ShadrackAdwera]

Hey, did you find a solution to this?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You can reopen it if it required.