diff --git a/examples/app.tsx b/examples/app.tsx
index c028fdf52..5ce8ee366 100644
--- a/examples/app.tsx
+++ b/examples/app.tsx
@@ -120,10 +120,68 @@ class App extends PureComponent<{}, AppState> {
           </Row>
 
           <Row>
-            <Column>
+            <Column xs={12} sm={6}>
+              <h3>Using DIVs as Buttons</h3>
+              <InputGroup>
+                <input type="number" />
+                <Button component="div" tabIndex={0}>
+                  Done
+                </Button>
+              </InputGroup>
+
+              <InputGroup block>
+                <InputGroupAddon>$</InputGroupAddon>
+                <input type="number" />
+                <Button component="div" tabIndex={0}>
+                  Done
+                </Button>
+              </InputGroup>
+
+              <InputGroup block>
+                <InputGroupAddon>
+                  <span>$</span>
+                </InputGroupAddon>
+                <input type="number" />
+                <Button component="div" tabIndex={0}>
+                  Done
+                </Button>
+              </InputGroup>
+
               <InputGroup>
+                <Button component="div" tabIndex={0}>
+                  1
+                </Button>
+                <Button component="div" tabIndex={0}>
+                  2
+                </Button>
+                <Button component="div" tabIndex={0}>
+                  3
+                </Button>
+                <Button component="div" tabIndex={0}>
+                  4
+                </Button>
+              </InputGroup>
+            </Column>
+            <Column xs={12} sm={6}>
+              <h3>Using Buttons</h3>
+              <InputGroup>
+                <InputGroupAddon>£</InputGroupAddon>
+                <input type="number" />
+              </InputGroup>
+              <InputGroup block>
                 <InputGroupAddon>£</InputGroupAddon>
                 <input type="number" />
+                <Button>I'm a button!</Button>
+              </InputGroup>
+              <InputGroup>
+                <input type="number" />
+                <Button>Send Button</Button>
+              </InputGroup>
+              <InputGroup block>
+                <Button>Button 1</Button>
+                <Button>Button 2</Button>
+                <Button>Button 3</Button>
+                <Button>Button 4</Button>
               </InputGroup>
             </Column>
           </Row>
diff --git a/src/less/buttons.less b/src/less/buttons.less
index bad233321..c942aa389 100644
--- a/src/less/buttons.less
+++ b/src/less/buttons.less
@@ -78,6 +78,7 @@
 
   &.block {
     display: block;
+    display: flex; // lesshint duplicateProperty: false
     width: 100%;
     margin-left: 0;
   }
diff --git a/src/less/inputs.less b/src/less/inputs.less
index 6c466cfa2..ea13fdbf5 100644
--- a/src/less/inputs.less
+++ b/src/less/inputs.less
@@ -131,66 +131,101 @@ textarea {
 }
 
 .input-group {
-  display: inline-table !important; // lesshint importantRule: false
+  display: inline-table;
   width: auto;
-  margin-top: @margin-large;
-  margin-bottom: @margin-large;
+  margin: @margin-large auto;
   border-collapse: separate;
   border-spacing: 0;
 
   &.block {
     display: table;
     width: 100%;
-  }
 
-  & > * { // lesshint universalSelector: false
-    width: 1px;
+    button,
+    .button,
+    .input-group-addon {
+      width: 1%;
+      white-space: nowrap;
+      vertical-align: middle;
+    }
+
+    & > input,
+    & > .input,
+    & > select,
+    & > .select {
+      width: 100%;
+    }
   }
 
-  & > label,
-  & > input,
-  & > select,
-  & > button,
-  & > .input-group-addon,
-  & > .input,
-  & > .select,
-  & > .label,
-  & > .button {
-    display: table-cell;
-    margin-top: 0;
-    margin-bottom: 0;
+  input,
+  button,
+  .button,
+  .input-group-addon {
     border: @input-border;
-    border-right: @border-none;
-
-    &:first-child {
-      border-top-right-radius: 0;
-      border-bottom-right-radius: 0;
-    }
+    border-left-width: 0;
+  }
 
-    &:last-child {
-      border: @input-border;
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-    }
+  /* IE10 layout fix */
+  div.button {
+    overflow: inherit;
+  }
 
-    &:not(:last-child):not(:first-child) {
-      border-radius: 0;
-    }
+  & > *:first-child { // lesshint universalSelector: false
+    border-left: @input-border;
+    border-top-left-radius: @border-radius-base;
+    border-bottom-left-radius: @border-radius-base;
   }
 
-  & > input,
-  & > select,
-  & > .input,
-  & > .select {
-    width: 100%;
+  & > *:last-child { // lesshint universalSelector: false
+    border-top-right-radius: @border-radius-base;
+    border-bottom-right-radius: @border-radius-base;
   }
 
-  & > .input-group-addon {
+  & > * { // lesshint universalSelector: false
+    display: table-cell;
+    min-height: @input-height;
+    border-left-width: none;
+    border-radius: 0;
     vertical-align: middle;
-    height: @input-height;
+    white-space: nowrap;
+  }
+
+  .input-group-addon {
     padding: @padding-base / 2 @padding-base;
-    border-radius: @border-radius-base;
-    background-color: @input-group-addon-background;
-    line-height: 1em;
+  }
+}
+
+@supports (display: flex) {
+  .input-group {
+    display: inline-flex;
+
+    &.block {
+      display: flex;
+
+      & > input,
+      & > .input,
+      & > select,
+      & > .select {
+        flex-grow: 1;
+        justify-self: stretch;
+        width: auto;
+      }
+
+      button,
+      .button,
+      .input-group-addon {
+        width: auto;
+      }
+     }
+
+     button,
+      .button,
+      .input-group-addon {
+        display: inline-flex;
+      }
+
+    .input-group-addon {
+      align-items: center;
+    }
   }
 }
diff --git a/src/less/overrides.less b/src/less/overrides.less
index bee56781b..19db66c92 100644
--- a/src/less/overrides.less
+++ b/src/less/overrides.less
@@ -110,10 +110,12 @@ pre {
   cursor: pointer;
   overflow: hidden;
   display: inline-block;
+  display: inline-flex; // lesshint duplicateProperty: false
   text-decoration: none;
   font-size: @font-size-button;
   line-height: @line-height-button;
   height: auto;
+  align-items: center;
 }
 
 button {