Как улучшить CSS вкладки в стиле дерева Firefox для многострочных вкладок?

А как насчет -webkit-line-clamp?

/*multi line tabs*/
tab-item {
  max-height: 4em !important;
  overflow: hidden !important;
  text-align:top;
}
tab-item tab-label {
  overflow-y: hidden !important;
  text-align:top;
  white-space: wrap !important;
  display: -webkit-inline-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  padding-top: 10px;
  padding-bottom: 10px;  
}

В итоге я опирался на ответ @Jordan Mann.

Вот что я придумал:

• ** удаление height:auto восстанавливает все вкладки **, до того, как последние вкладки не отображались
• 2 строк на вкладке достаточно
• скорректировано поле метки на вкладке.

Для меня это идеально :-)

/*multi line tabs*/
tab-item {
  /*max-height: 4em !important;*/
  overflow: hidden !important;
  /*border: 1px solid red;*/ /*for debugging....*/
  /*margin: 5px;*/ /*for debugging....*/
  /*text-align:top;*/
  /*height: auto;*/
  margin-left:3px;
}
tab-item tab-label {
  overflow-y: hidden !important;
  text-align:top;
  white-space: wrap !important;
  display: -webkit-inline-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin-top: 5px;
  margin-bottom: 5px;
}