//wxml
<block wx:for="{{message}}" wx:key="_id">
  <movable-area >
      <movable-view class="movable-view" direction="horizontal" inertia="true"  damping="100">
          <view class="list">
            <view class="text">
              <view class="theme">{{item.articleTitle}}</view>
            </view>
            <view class="pic">      
              <image class="img" mode="aspectFill" src="{{item.picture}}"/>
            </view>
          </view>
          <view class="delete" bindtap="delMes">删除</view>
      </movable-view>
  </movable-area>
</block> 

//css
movable-area{
  width: 95vw; 
  height: 140rpx; 
  margin-right: -24rpx; 
  white-space: nowrap;
 }
  
  .movable-view{
  width: 120vw;
  height: 140rpx;
  display: flex;
  justify-content: space-between;
 }
    
   .movable-view .list{
      display: flex;
      width: 100vw;
   }
    
    .movable-view .list .text{
      width: 70vw; 
      height: 140rpx;
      position: absolute;
      right: 20vw;
      display: flex;
    }
    
     .list .theme{
      width: 100%;
      font-size: 40rpx;
      height: 140rpx;
      width: 70vw;
      font-weight: 550;
      padding: 10rpx;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    } 
     
    .list .pic{ display: flex; width: 30vw; height: 140rpx;}
    .list .img{  width:100%; height: 100%;}
  
  .delete{
  width: 20vw;
  background-color: red;
  color:  white;
  display: flex;
  align-items: center;
  justify-content: center;
}