I have a LWC component (NOT Aura) that has a datatable with just one column.

By default, the width of that column is 1000 px, which is way too small.

Using max-column-width="4000" or similar on the lightning-datatable tag i can get the column to size itself to screen width.

However, if the user then resizes the screen, the column does not follow that.

Is there any way to set the column to be 100% width rather than a fixed value in pixels?

As requested, here's the code which is absolutely vanilla...

 <lightning-datatable key-field="Id" data={data} columns={columns} is-loading={loading} max-column-width="4000">

Js file:

@track data = [{ Id: '1', Name: 'test', link: '/somewhere/else' }];
@track loading = false;
    columns = [
        { label: 'Name', fieldName: 'link', type: 'url', typeAttributes: {
            label: { fieldName: 'Name' }
          } }
  • can you paste the code here? Jun 13, 2019 at 8:01
  • @rahulgawale sure but it doesn't help at all.
    – zaitsman
    Jun 13, 2019 at 8:21
  • 1
    did you find a solution to that? facing the same issue
    – Dana Griff
    Dec 16, 2019 at 13:13
  • @DanaGriff it just started working; it is not really responsive in that you can see it redraw, but it works. I changed nothing and highly suspected that one fo the patches to LWC that SF deployed did that.
    – zaitsman
    Dec 18, 2019 at 23:05

1 Answer 1


for me it solved with following css

.datatable-full-size {
  width: 100% !important;

And in the html side

<lightning-datatable class="datatable-full-size" key-field="Id" columns={columnsSolutions} data={solutionsList}></lightning-datatable>

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .