Firefox не учитывает ширину вертикальной полосы прокрутки при вычислении размера родительского div

Question

.scroll {
  position: absolute;
  left: 0;
  top: 0;
  background: yellow;
  overflow: auto;
  max-height: 100px;
}

<div class="scroll">
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
</div>

Firefox 79

Когда высота div переполняется, Firefox отображает вертикальную полосу прокрутки без увеличение ширины div для его размещения, в результате чего отображается горизонтальная полоса прокрутки.

Chrome 84

Chrome increases the width of the div as expected and no horizontal scrollbar is shown.

Chrome скриншот

Как я могу заставить Firefox работать как Chrome?

Ограничения:

• Ширина scroll div должна соответствовать его содержимое.
• Переполнение должно быть автоматическим.

Что я пробовал:

• min-width: 0/auto
• Flexbox ( для получения автоматической ширины)
• Различные комбинации дополнительных div-ов оболочки

Answer 1

Попробуйте использовать:

width: fit-content;

или

width: min-content;

или

width: max-content;

Answer 2

.scroll {
    position: absolute;
    left: 0;
    top: 0;
    display:block;
    background: yellow;
        
    max-height: 100px;
    max-width:auto;
    overflow-y:auto;
    padding-right:18px;
 }

<div class="scroll">
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
  <div>123456789</div>
</div>