container表示任何容器，100px的固定宽度值实际上并不重要，因为容器的宽度可以是可变的，这个解决方案仍然有效。
我认为你的问题有点过于复杂了，你使用了正确的属性，但是你应用的其他属性可能会有一些复杂性。
在包含将要溢出的内容的容器上使用overflow: auto将只在内容实际溢出时显示滚动条，而不是像使用overflow: scroll那样显示静态滚动条。
您看到的border位于low_rolls-元素周围，因此您可以看到它何时溢出。

.container {
  width: 100px;
}

.containertwo {
  width: 100%;
}

/* flex for demo purpose, not necessary */
.die_results {
  display: flex;
  width: 100%;
}

/* force scroll on overflow */
.low_rolls_container {
  overflow-x: auto;
}

.low_rolls {
  border: 1px solid black;
  font-size: .7rem;
  padding: 2px 5px 0 0;
  white-space: nowrap;
}

<div class="container">
  <div class="die_results">
    <div class="low_rolls_container">
      <div class="low_rolls">1, 2, 3, 6, 2, 3, 6, 5, 5, 7, 9, 1, 2, 3, 6, 2, 3, 6, 5, 5, 7, 9</div>
    </div>
    <div class="high_roll">23</div>
  </div>
</div>

<div class="container containertwo">
  <div class="die_results">
    <div class="low_rolls_container">
      <div class="low_rolls">1, 2, 3, 6, 2, 3, 6, 5, 5, 7, 9, 1, 2, 3, 6, 2, 3, 6, 5, 5, 7, 9</div>
    </div>
    <div class="high_roll">23</div>
  </div>
</div>