Element-ui 5列布局

element-ui 并没有实现5列布局，其实自己实现也超级容易

24/5=4.8，每列点4.8格，所以干脆用 el-col-sm-4-8，el-col-md-4-8,el-col-lg-4-8,el-col-xl-4-8 命名，直接如下代码添加5列样式，

直接如下图使用

效果如下

---

@media only screen and (min-width:768px) {

    .el-col-sm-4-8 {

        width: 20%

    }

    .el-col-sm-offset-4-8 {

        margin-left: 20%

    }

    .el-col-sm-pull-4-8 {

        position: relative;

        right: 20%

    }

    .el-col-sm-push-4-8 {

        position: relative;

        left: 20%

    }

}

@media only screen and (min-width:992px) {

    .el-col-md-4-8 {

        width: 20%

    }

    .el-col-md-offset-4-8 {

        margin-left: 20%

    }

    .el-col-md-pull-4-8 {

        position: relative;

        right: 20%

    }

    .el-col-md-push-4-8 {

        position: relative;

        left: 20%

    }

}

@media only screen and (min-width:1200px) {

    .el-col-lg-4-8 {

        width: 20%

    }

    .el-col-lg-offset-4-8 {

        margin-left: 20%

    }

    .el-col-lg-pull-4-8 {

        position: relative;

        right: 20%

    }

    .el-col-lg-push-4-8 {

        position: relative;

        left: 20%

    }

}

@media only screen and (min-width:1920px) {

    .el-col-xl-4-8 {

        width: 20%

    }

    .el-col-xl-offset-4-8 {

        margin-left: 20%

    }

    .el-col-xl-pull-4-8 {

        position: relative;

        right: 20%

    }

    .el-col-xl-push-4-8 {

        position: relative;

        left: 20%

    }

}