如何在html/css的mobile/tablet视图中水平滚动内容

我正在做一件事 fiddle 其中我想水平滚动 , 全球特许经营权 和 其他图像 如小提琴中的一行。这个

移动视图 水平滚动

目前,图片适合移动屏幕,但他们是压缩的,所以这就是为什么我想让内容滚动 移动视图 为了避免压缩问题。

.images {
  display: flex;
  align-items:center;
  background-color: #eee;
  padding: 1rem;


}

.images > div {
      flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}
.images img {
  max-width:100%;
  width: 100%;
}

问题陈述:

我想知道什么CSS代码,我应该添加在小提琴,使图像应该水平滚动,而不创造任何空白,在右边的文字被固定在顶部。