/*.chat-bg{ position:fixed; width: 100%; height: 100%; z-index: 0; top: 50px; }*/ .scroll_view,.scroll_view_change { /* width: 100%; position: absolute; left: 0; right: 0; bottom: 170rpx; */ background-color: #FAFAFA; padding-bottom: 100rpx; } .scroll_view_X, .scroll_view_change_X{ padding-bottom: 230rpx; } .message { width: 100%; height: auto; padding: 0 30rpx; position: relative; box-sizing: border-box; } .time { margin: 14rpx 0; text-align: center; } .time .time-text { display: inline-block; padding: 6rpx 20rpx 0 20rpx; font-size: 24rpx; color: #fff; line-height: 28rpx; border-radius: 4rpx; background-color: #dcdcdc; } .user .user-text { margin: auto 100rpx 8rpx; font-size: 20rpx; color: #dcdcdc; display: block; } .avatar { width: 72rpx; height: 72rpx; margin: 0 20rpx 0 0; border-radius: 50%; float: left; } .msg { display: inline-block; padding: 20rpx; max-width: calc(85% - 80rpx); min-height: 40rpx; font-size: 24rpx; /*overflow: hidden;*/ text-align: left; word-break: break-all; background-color: #fff; border-radius: 26rpx; position: relative; margin-top: 24rpx; } .msg .msg_poprightarrow { position: absolute; right: -10rpx; height: 18rpx; width: 18rpx; margin-top: -10rpx; } .msg .msg_popleftarrow{ position:absolute; left: -14rpx; height: 18rpx; width: 18rpx; margin-top: -10rpx; } .msg .msg-text { line-height: 40rpx; font-size: 32rpx; margin: 0; } /*.msg:before { content: " "; position: absolute; top: 9px; right: 100%; border: 6px solid transparent; border-right-color: #EDEDED; }*/ .self { text-align: right; } .self .avatar { float: right; margin: 0 0 0 20rpx; } .user { position: relative; bottom: -30rpx; } .self .msg { background-color: #0873DE; color: #fff; } .self .msg:before { right: inherit; left: 100%; border-right-color: transparent; border-left-color: #b2e281; } .template { display: inline; } .err{ width: 32rpx; height: 32rpx; position: absolute; left: -40rpx; } .hide{ display: none; } .show{ display: block; }