How to limit the height of a button in a lightning-datatable?

Question

My lightning-datatable has a column that is a button, variant 'base', which causes all rows to be unnecessarily high. Because it is of variant 'base', it is shown as a simpel text link, so the height allocated to it is simply too much. I know that this button is responsible for the height of the row, because omitting it makes the row lower (as I want it to be).

How can I set the maximum height of this button, or of the entire row?

This is the definition of the datatable:

<div class="slds-col slds-p-vertical_xx-small">
    <lightning-datatable
        key-field="Id"
        data={searchResults}
        columns={searchResultColumns}
        draft-values={draftValues}
        oncellchange={handleChangedQuantity}
        onrowaction={handleSearchResultRowAction}
        hide-checkbox-column="true"
        column-widths-mode="auto"
        suppress-bottom-bar="true">
    </lightning-datatable>
</div>

This is the definition of the column that contains the button:

{ label: data.fields.OnOrder__c.label, fieldName: 'OnOrder__c', type: 'button',
  typeAttributes: { name: 'backorders', value: 'backorders', label: { fieldName: 'OnOrder__c' },
  variant: 'base', disabled: { fieldName: 'ProductNotOnOrder__c' } },
  hideDefaultActions: true }

Answer 1

Well, I forgot to mention in my question that I had already tried the naieve solution, such as setting the height of the button, but those settings were ignored.

After more than a day of googling and investigating, this is what worked for me. Adding the following to the definition of the button:

cellAttributes: { class: 'slds-p-vertical_none slds-m-vertical_none' }

Quite simple when you look at it, but for me it was not so simple to find out. This addition removes all vertical space around the button and brings the rows closer together, vertically, though there is still space left.

Answer 2

Does this still work for you? I have found that it limits some padding but not as much as I need.

            {   label: 'Build Task',
            fieldName: 'name',
            type: 'button',
            iconName: "custom:custom70",
            sortable: true,
            typeAttributes: {
                name: 'view',
                value: 'view',
                label: { fieldName: 'name' },
                variant: 'base'
            },
            cellAttributes: { class: 'slds-p-vertical_none slds-m-vertical_none'},
            hideDefaultActions: true,
            initialWidth: 145,
        },