Tabledrag styles in claro break expandable elements (Firefox)

Problem/Motivation

In firefox, when placing an expandable element (e.g. details) within a tabledrag container, expanding the details causes the expanded content to overflow the table cell in unpredictable and unusable ways.

Looking at the code, I'm honestly kind of flummoxed as to why table cells grow in some places but not in others:

tables.pcss.css:

td {
  box-sizing: border-box;
  height: 4rem;
  padding: var(--space-xs) var(--space-m);
  text-align: start;
}

Steps to reproduce

The screenshot above shows a custom_field formatter.

• Install drupal with the standard profile
• Install drupal/custom_field
• Add a field with subfields
• View the manage display tab for your node type

Proposed resolution

Replace "height: 4rem" with "min-height: 4rem". Doing this does cause some additional shifts in the layout, in Chromium, but those shifts match the current state of display in firefox.

Remaining tasks

User interface changes

Introduced terminology

API changes

Data model changes

Release notes snippet