diff --git a/packages/theme-default/src/col.css b/packages/theme-default/src/col.css
index ddb4f23c0..0dce6408c 100644
--- a/packages/theme-default/src/col.css
+++ b/packages/theme-default/src/col.css
@@ -6,10 +6,10 @@
   box-sizing: border-box;
 }
 .el-col-0 {
-  display: none;
+  width: 0;
 }
 
-@for $i from 1 to 24 {
+@for $i from 0 to 24 {
   .el-col-$i {
     width: calc(1 / 24 * $(i) * 100)%;
   }
@@ -27,10 +27,7 @@
 }
 
 @media (max-width: 768px) {
-  .el-col-xs-0 {
-    display: none;
-  }
-  @for $i from 1 to 24 {
+  @for $i from 0 to 24 {
     .el-col-xs-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
@@ -49,10 +46,7 @@
 }
 
 @media (min-width: 768px) {
-  .el-col-sm-0 {
-    display: none;
-  }
-  @for $i from 1 to 24 {
+  @for $i from 0 to 24 {
     .el-col-sm-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
@@ -70,10 +64,7 @@
   }
 }
 @media (min-width: 992px) {
-  .el-col-md-0 {
-    display: none;
-  }
-  @for $i from 1 to 24 {
+  @for $i from 0 to 24 {
     .el-col-md-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }
@@ -91,10 +82,7 @@
   }
 }
 @media (min-width: 1200px) {
-  .el-col-lg-0 {
-    display: none;
-  }
-  @for $i from 1 to 24 {
+  @for $i from 0 to 24 {
     .el-col-lg-$i {
       width: calc(1 / 24 * $(i) * 100)%;
     }