Элементы Overflow-X сжимаются и прокрутка не достигается

Question

Контейнер div с элементами шириной 150px. При наличии нескольких элементов его ширина отображается в соответствии с определением (как показано на рисунке)

HTML код (JSX):

<div className="filter-overview-container">
    <div className="search-filter-item">
      <h6>Last Name</h6>
      <p>Hameed</p>
      <CrossBtn fill={"#fff"} />
    </div>
    <div className="search-filter-item">
      <h6>First Name</h6>
      <p>Faiz Hameed</p>
      <CrossBtn fill={"#fff"} />
    </div>
    <div className="search-filter-item">
      <h6>Company</h6>
      <p>Corefactors</p>
      <CrossBtn fill={"#fff"} />
    </div>
    <div className="search-filter-item">
      <h6>Address</h6>
      <p>Bangalore</p>
      <CrossBtn fill={"#fff"} />
    </div>
    <div className="search-filter-item">
      <h6>Address</h6>
      <p>Bangalore</p>
      <CrossBtn fill={"#fff"} />
    </div>
    <div className="search-filter-item">
      <h6>Address</h6>
      <p>Bangalore</p>
      <CrossBtn fill={"#fff"} />
    </div>
  </div>

CSS код (с css):

.filter-overview-container {
    border-radius: 250px 0px 0 250px;
    height: 91px;
    width: calc(1277 / 1920 * 100%);
    align-content: center;
    display: flex;
    align-self: center;
    background-color: #2143af;
    overflow-x: auto;
    .search-filter-item {
      width: 150px;
      display: grid;
      grid-template-columns: 5fr 1fr;
      grid-template-rows: 1fr 1fr;
      grid-auto-flow: column;
      height: 59px;
      border-radius: 250px;
      border: 1px solid rgba(245, 248, 251, 0.15);
      align-items: center;
      padding: 0 22px;
      padding: 0 22px;
      margin: auto 15px;
    }
  }

Но если я добавлю больше элементов в контейнер, ширина отдельного элемента уменьшится, даже если я добавлю прокрутку переполнения. см. рисунок 2, что нежелательно, вместо этого я хотел прокрутить содержимое, сохраняя ширину, определенную в css. Я пробовал оба overflow-x:scroll | auto

Извините, если задают этот вопрос, я не могу найти решение, почему это произошло