CSS Multiple line ellipsis issue

minxin.scss

.u-text-limit {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
}

.u-text-limit--one {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.u-text-limit--two {
    @extend .u-text-limit;
    -webkit-line-clamp: 2;
}

.u-text-limit--three {
    @extend .u-text-limit;
    -webkit-line-clamp: 3;
}