fix col responsive style bug

examples/docs/zh-CN/layout.md

@@ -250,7 +250,7 @@
 ::: demo 将 `type` 属性赋值为 'flex'，可以启用 flex 布局，并可通过 `justify` 属性来指定 start, center, end, space-between, space-around 其中的值来定义子元素的排版方式。
 ```html
 <el-row type="flex" class="row-bg">
-  <el-col :span="6" :sm="8" :md="{span: 4, offset: 2}"><div class="grid-content bg-purple"></div></el-col>
+  <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
   <el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
   <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
 </el-row>

packages/theme-default/src/col.css

@@ -32,17 +32,17 @@
     .el-col-sm-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
-  }
-  .el-col-xs-offset-$i {
-    margin-left: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-xs-pull-$i {
-    position: relative;
-    right: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-xs-push-$i {
-    position: relative;
-    left: calc(1 / 24 * $(i) * 100)%;
+    .el-col-xs-offset-$i {
+      margin-left: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-xs-pull-$i {
+      position: relative;
+      right: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-xs-push-$i {
+      position: relative;
+      left: calc(1 / 24 * $(i) * 100)%;
+    }
   }
 }
 @media (min-width: 992px) {
@@ -50,17 +50,17 @@
     .el-col-md-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
-  }
-  .el-col-md-offset-$i {
-    margin-left: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-md-pull-$i {
-    position: relative;
-    right: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-md-push-$i {
-    position: relative;
-    left: calc(1 / 24 * $(i) * 100)%;
+    .el-col-md-offset-$i {
+      margin-left: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-md-pull-$i {
+      position: relative;
+      right: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-md-push-$i {
+      position: relative;
+      left: calc(1 / 24 * $(i) * 100)%;
+    }
   }
 }
 @media (min-width: 1200px) {
@@ -68,16 +68,16 @@
     .el-col-lg-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
-  }
-  .el-col-xs-offset-$i {
-    margin-left: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-xs-pull-$i {
-    position: relative;
-    right: calc(1 / 24 * $(i) * 100)%;
-  }
-  .el-col-xs-push-$i {
-    position: relative;
-    left: calc(1 / 24 * $(i) * 100)%;
+    .el-col-xs-offset-$i {
+      margin-left: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-xs-pull-$i {
+      position: relative;
+      right: calc(1 / 24 * $(i) * 100)%;
+    }
+    .el-col-xs-push-$i {
+      position: relative;
+      left: calc(1 / 24 * $(i) * 100)%;
+    }
   }
 }