diff --git a/packages/core/src/components/fab-button/fab-button.scss b/packages/core/src/components/fab-button/fab-button.scss
index 0786f70663..20398ea25b 100755
--- a/packages/core/src/components/fab-button/fab-button.scss
+++ b/packages/core/src/components/fab-button/fab-button.scss
@@ -16,6 +16,8 @@
   width: $fab-size;
   height: $fab-size;
 
+  border: none;
+
   font-size: 14px;
   line-height: $fab-size;
   text-overflow: ellipsis;
@@ -41,6 +43,19 @@
   line-height: 1;
 }
 
+.button-inner {
+  display: flex;
+
+  flex-flow: row nowrap;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+
+  width: 100%;
+  height: 100%;
+}
+
+
 // FAB Mini
 // --------------------------------------------------
 
diff --git a/packages/core/src/components/fab/test/standalone/index.html b/packages/core/src/components/fab/test/standalone/index.html
index fd648e5191..88867c7b61 100644
--- a/packages/core/src/components/fab/test/standalone/index.html
+++ b/packages/core/src/components/fab/test/standalone/index.html
@@ -9,35 +9,117 @@
 </head>
 
 <body>
-  <ion-fab top right id="fab1">
-    <ion-fab-button onclick="toggleList('fab1')" mini><ion-icon name="add"></ion-icon></ion-fab-button>
+  <f></f>
+  <f></f>
+  <ion-fab-button>FAB</ion-fab-button>
+
+  <ion-fab top right id="fab1" slot="fixed">
+    <ion-fab-button onclick="clickMainFAB('fab1')" mini class="e2eFabTopRight"><ion-icon name="add"></ion-icon></ion-fab-button>
     <ion-fab-list>
-      <ion-fab-button onclick="toggleList('fab1')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab1')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab1')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab1')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('facebook', 'fab1')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('twitter', 'fab1')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('vimeo', 'fab1')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('googleplus', 'fab1')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
     </ion-fab-list>
   </ion-fab>
 
-  <ion-fab bottom left id="fab2">
-    <ion-fab-button onclick="toggleList('fab2')">More</ion-fab-button>
-    <ion-fab-list side="right">
-      <ion-fab-button onclick="toggleList('fab2')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab2')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab2')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
-      <ion-fab-button onclick="toggleList('fab2')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
+  <ion-fab bottom right id="fab2" slot="fixed">
+    <ion-fab-button onclick="clickMainFAB('fab2')" color="dark" class="e2eFabBottomRight"><ion-icon name="arrow-dropleft"></ion-icon></ion-fab-button>
+    <ion-fab-list side="left">
+      <ion-fab-button onclick="openSocial('facebook', 'fab2')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('twitter', 'fab2')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('vimeo', 'fab2')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('googleplus', 'fab2')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
     </ion-fab-list>
   </ion-fab>
 
+  <ion-fab top left id="fab3" slot="fixed">
+    <ion-fab-button onclick="clickMainFAB('fab3')" color="secondary" class="e2eFabTopLeft"><ion-icon name="arrow-dropright"></ion-icon></ion-fab-button>
+    <ion-fab-list side="right">
+      <ion-fab-button onclick="openSocial('facebook', 'fab3')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('twitter', 'fab3')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('vimeo', 'fab3')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('googleplus', 'fab3')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+  </ion-fab>
+
+  <ion-fab bottom left id="fab4" slot="fixed">
+    <ion-fab-button onclick="clickMainFAB('fab4')" color="light" class="e2eFabBottomLeft"><ion-icon name="arrow-dropup"></ion-icon></ion-fab-button>
+    <ion-fab-list side="top">
+      <ion-fab-button onclick="openSocial('facebook', 'fab4')"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('twitter', 'fab4')"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('vimeo', 'fab4')"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
+      <ion-fab-button onclick="openSocial('googleplus', 'fab4')"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+  </ion-fab>
+
+  <ion-fab center middle id="fab5" slot="fixed">
+    <ion-fab-button onclick="clickMainFAB('fab5')" class="e2eFabCenter"><ion-icon name="md-share"></ion-icon></ion-fab-button>
+    <ion-fab-list side="top">
+      <ion-fab-button onclick="openSocial('vimeo', 'fab5')" color="primary"><ion-icon name="logo-vimeo"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+    <ion-fab-list side="bottom">
+      <ion-fab-button onclick="openSocial('facebook', 'fab5')" color="secondary"><ion-icon name="logo-facebook"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+    <ion-fab-list side="left">
+      <ion-fab-button onclick="openSocial('googleplus', 'fab5')" color="light"><ion-icon name="logo-googleplus"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+    <ion-fab-list side="right">
+      <ion-fab-button onclick="openSocial('twitter', 'fab5')" color="dark"><ion-icon name="logo-twitter"></ion-icon></ion-fab-button>
+    </ion-fab-list>
+  </ion-fab>
+
+  <ion-fab right middle slot="fixed">
+    <ion-fab-button color="danger" onclick="add()"><ion-icon name="add"></ion-icon></ion-fab-button>
+  </ion-fab>
+
   <script>
-    function toggleList(container) {
+    function insertAfter(el, referenceNode) {
+      referenceNode.parentNode.insertBefore(el, referenceNode.nextSibling);
+    }
+
+    function add() {
+      var newEle = document.createElement('f');
+      var ref = document.querySelector('f');
+      insertAfter(newEle, ref);
+      console.log('add');
+    }
+
+    function clickMainFAB(container) {
+      let message = 'Clicked open social menu';
+      console.log(message);
+
+      openLists(container);
+    }
+
+    function openSocial(network, container) {
+      let message = 'Share in ' + network;
+      console.log(message);
+
+      openLists(container);
+    }
+
+    function openLists(container) {
       var fabLists = document.getElementById(container).querySelectorAll('ion-fab-list');
 
       for (var i = 0; i < fabLists.length; i++) {
-        var activated = fabLists[i].activated;
-        fabLists[i].activated = activated ? false : true;
+        fabLists[i].activated = true;
       }
     }
   </script>
+
+  <style>
+    f {
+      display: block;
+      margin: 15px auto;
+      max-width: 150px;
+      height: 150px;
+      background: blue;
+    }
+
+    f:last-of-type {
+      background: yellow;
+    }
+  </style>
 </body>
 </html>
