Просмотр исходного текста страницы Sticky bug

<html>
<div style="display: flex">
  <div style="overflow-x: scroll; flex: 1">
    <div style="display: flex; flex-shrink: 0">
      <div style="position: sticky; left: 0; background: red; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
      <div style="background: green; width: 300px; height: 30px; flex-shrink: 0"></div>
    </div>
  </div>
  <div style="width: 200px">
  </div>
</div>
</html>