2

I'm trying to set the column widths for lightning:datatable, but I don't see anywhere in the documentation on how to do this. I was thinking of tinkering with minColumnWidth and maxColumnWidth and see if it would auto-adjust to my liking, but as of August 2018, this functionality is broken

I have a datatable that has many columns that can be very skinny, while other columns should be much bigger. Right now, everytime the page loads, the column widths are evenly distributed.

  • I had used these attributes in the past and it worked fine (and quite sure it does not work now because of the known issue :)). Not sure if there's any other way that you can fix the widths. – Jayant Das Aug 9 '18 at 15:11
6

You can use the initialWidth property of the column to set the width when it is rendered. It can still be resized.

[
    { label: 'Message', fieldName: 'Description', type: 'text' },
    {   
        type:  'button',
        initialWidth: 34,
        typeAttributes: {
            iconName: 'utility:new_window',
            name: 'newWindow', 
            title: 'Popout Window', 
            disabled: false, 
            value: 'test'
        }
    }
]
  • initialWidth worked like a dream. Thank you! – Brian Miller Dec 9 '18 at 18:16
0

you need to use your Lightning:DataTable inside Div Tag and Apply the SLDS Stlying.You can't control the Column width of DataTable Directly.

You need to use SLDS for Div and it will show accordingly.PFB the Code.

<div style="slds-col slds-size_2-of-8"> <lightning:datatable data="{!v.mydata}" columns="{!v.mycolumns}" keyField="id" hideCheckboxColumn="true" onrowaction="{! c.handleRowAction }"/> </div>

  • 1
    You're suggesting to put a grid / layout around the datatable. I need the widths of the columns themselves of the datatable to be adjusted – Brian Miller Aug 26 '18 at 7:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.