Data table: th padding removed in slds-table--fixed-layout with Spring '17?

[stephenscholtz]

Hi there,

I have a lightning component I built using the data table element. The lightning component is currently being served through a VF page with Lightning Out

When my sandboxes were upgraded Spring '17, I'm guessing the built-in LDS was upgraded too, because the header's in my data table suddenly looked different. The data table uses "slds-table--fixed-layout", and there is a line of CSS that seems to have been added which removes table header padding. Poking through _index.scss on the LDS site, we have...

.slds-table--fixed-layout {
  table-layout: fixed;
  width: 100%;
  white-space: nowrap;

  thead {
    background-color: $color-background-alt;

    th {
      padding: 0; // Due to HTML structure, need to reset the padding on all th elements in thead
    }
  }

The th padding: 0 seems new. (I looked in an old static resource copy of LDS and couldn't find an equivalent.)

Editing the HTML of the LDS site and applying the class, you end up with this formatting on the headers:

It didn't compress like that before. Maybe I was using slds-table--fixed-layout incorrectly, by itself, and maybe it's only supposed to be used with the addition of the resizable column markup? It can't be used on its own?

At any rate, wanted to point this out in case this was an unintended change, or others ran into it.

Work around this by adding some overrides in your CSS (examples provided are for use in a lightning component):

.THIS.slds-table.slds-table--fixed-layout thead th {
    padding: 0.5rem;
}
.THIS.slds-table.slds-table--cell-buffer tr>th:first-child {
    padding-left: 1.5rem;
}

Or remove .slds-table--fixed-layout from your table and apply your own fixed layout...

.THIS.slds-table {
    table-layout: fixed;
}

[kaelig]

Thank you for confirming this, @stephenscholtz. We are aware that this change may appear as a regression to some customers and will provide a fix/workaround very soon.

[ishakasliwal]

This should be fixed in v2.2.2, thank you again for reporting this!