scroll-view导致子元素的overflow:hidden失效
发布于 6 年前 作者 mingluo 12500 次浏览 来自 问答

HTML：

<scroll-view scroll-x  class="list-wrapper">
    <view class="list">
        <view wx:for="{{5}}" wx:key="index" class="item">
            <view class="right">
                <view class="goods-name">HENRIKSDAL 亨利克首页 /餐厅 / 餐椅· /软垫式餐椅</view>
            </view>
        </view>
    </view>
</scroll-view >

css：

.list {
  width: 2000rpx;
  display: flex;
  align-items: center;
}
.item {
  .goods-name {
    width: 200rpx;
    height: 66rpx;
    max-height: 66rpx;
    display: block;
    overflow: hidden;
  }
}

开发者工具：

表现正常

IOS11

表现不正常

2 回复

补充一下：

刚刚测试.list-wrapper的css变为

{
   overflow:hidden;
   -webkit-overflow-scrolling: touch;
}

也会造成上面的情况

怀疑是：

-webkit-overflow-scrolling: touch;

造成

遇到同样的问题，-webkit-overflow-scrolling: touch; 只要加了这个或者用他们提供的scroll组件 父子元素包括scroll 全部失效，老哥有解决吗

回到顶部