table-responsive class breaks sticky header

Problem/Motivation

The table template is wrapped in a div with class "table-responsive". This class has overflow-x: auto. This breaks the sticky-header. See https://stackoverflow.com/a/47878455 (ancestor elements should not have overflow).
Also although "sticky" variable is described as available in table.html.twig, it is not used in the template to set the 'sticky-header' class, and of course no class definition is provided in css style-sheet.

Steps to reproduce

Proposed resolution

- Remove "table-responsive" or make it optional
- Add "sticky-header" class
- Add ".sticky-header thead" definition in css

table.html.twig

{%
  set table_classes = [
    'table',
    hover ? 'table-hover',
    not no_striping ? 'table-striped' : 'table-bordered',
    sticky ? 'sticky-header',
  ]
%}
{% if not sticky %}
	<div class="table-responsive">
	{% endif %}
	<table{{attributes.addClass(table_classes)}}>
...
	</table>
	{% if not sticky %}
	</div>
{% endif %}

table.scss

.sticky-header thead {
    position: sticky;
    top:0;// "top" should be equal to the header's height. Is there a way to get it here ?
}

Remaining tasks

User interface changes

API changes

Data model changes