场景

项目中自己写一个轮播图，使用display:flext布局和oveflow-x:scroll等属性设置后，右边距失效了（仅在移动端）

解决办法

为div添加伪元素

 .swiperWrapper  ::after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; //占位但不可见
  }

   .swiperWrapper {
        // background: yellow;
        display: flex;
        justify-content: flex-start;
        position: relative;
        width: 100%;
        height: 100%;
        padding-left: 15px;
        margin-right: 5px;
        padding-bottom: 60px;// 滚动条向下移，外层盒子给定高overflow:hidden，解决ios无法隐藏滚动条问题
        box-sizing: border-box;
        overflow-x: scroll;