diff --git a/packages/table/src/table-body.js b/packages/table/src/table-body.js
index 73a001141..1b82fa387 100644
--- a/packages/table/src/table-body.js
+++ b/packages/table/src/table-body.js
@@ -28,13 +28,15 @@ export default {
         cellspacing="0"
         cellpadding="0"
         border="0">
-        {
-          this._l(this.columns, column =>
-            <col
-              name={ column.id }
-              width={ column.realWidth || column.width }
-            />)
-        }
+        <colgroup>
+          {
+            this._l(this.columns, column =>
+              <col
+                name={ column.id }
+                width={ column.realWidth || column.width }
+              />)
+          }
+        </colgroup>
         <tbody>
           {
             this._l(this.data, (row, $index) =>
diff --git a/packages/table/src/table-header.js b/packages/table/src/table-header.js
index 05ff8e513..19633a8d6 100644
--- a/packages/table/src/table-header.js
+++ b/packages/table/src/table-header.js
@@ -78,18 +78,20 @@ export default {
         cellspacing="0"
         cellpadding="0"
         border="0">
-        {
-          this._l(this.columns, column =>
-            <col
-              name={ column.id }
-              width={ column.realWidth || column.width }
-            />)
-        }
-        {
-          !this.fixed && this.layout.gutterWidth
-            ? <col name="gutter" width={ this.layout.scrollY ? this.layout.gutterWidth : '' }></col>
-            : ''
-        }
+        <colgroup>
+          {
+            this._l(this.columns, column =>
+              <col
+                name={ column.id }
+                width={ column.realWidth || column.width }
+              />)
+          }
+          {
+            !this.fixed && this.layout.gutterWidth
+              ? <col name="gutter" width={ this.layout.scrollY ? this.layout.gutterWidth : '' }></col>
+              : ''
+          }
+        </colgroup>
         <thead>
           {
             this._l(columnRows, (columns, rowIndex) =>