diff --git a/src/animations/animation.ts b/src/animations/animation.ts
index 69835200329..19e1ed90667 100644
--- a/src/animations/animation.ts
+++ b/src/animations/animation.ts
@@ -68,7 +68,7 @@ export class Animation {
     var i: number;
 
     if (ele) {
-      if (Array.isArray(ele)) {
+      if (ele.length) {
         for (i = 0; i < ele.length; i++) {
           this._addEle(ele[i]);
         }
diff --git a/src/components/app/test/cordova/page1.html b/src/components/app/test/cordova/page1.html
index 762332f9542..db1f9c2f3ac 100644
--- a/src/components/app/test/cordova/page1.html
+++ b/src/components/app/test/cordova/page1.html
@@ -18,7 +18,7 @@
     </button>
   </ion-navbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-title>I'm a toolbar</ion-title>
   </ion-toolbar>
 
diff --git a/src/components/app/test/cordova/page2.html b/src/components/app/test/cordova/page2.html
index 1aa9f46a50d..fb8435250aa 100644
--- a/src/components/app/test/cordova/page2.html
+++ b/src/components/app/test/cordova/page2.html
@@ -1,6 +1,6 @@
 <ion-header>
 
-  <ion-navbar>
+  <ion-navbar no-border-bottom>
     <ion-title>Page 2</ion-title>
     <button menuToggle>
       <ion-icon name="menu"></ion-icon>
@@ -15,8 +15,8 @@
     </button>
   </ion-navbar>
 
-  <ion-toolbar>
-    <ion-title>I'm a toolbar</ion-title>
+  <ion-toolbar no-border-top>
+    Hello, I am a sub header, with no border on top
   </ion-toolbar>
 
 </ion-header>
diff --git a/src/components/app/z-index.scss b/src/components/app/z-index.scss
index 2eb54087628..6e919f5239f 100644
--- a/src/components/app/z-index.scss
+++ b/src/components/app/z-index.scss
@@ -15,7 +15,7 @@ $z-index-refresher:              0;
 $z-index-page-container:         0;
 $z-index-selected-tab:           1;
 $z-index-toolbar:                10;
-$z-index-toolbar-background:     0;
+$z-index-toolbar-background:     -1;
 
 $z-index-backdrop:               2;
 $z-index-overlay-wrapper:        10;
diff --git a/src/components/modal/test/basic/index.ts b/src/components/modal/test/basic/index.ts
index d7b055cf105..b126e7d30e1 100644
--- a/src/components/modal/test/basic/index.ts
+++ b/src/components/modal/test/basic/index.ts
@@ -188,7 +188,7 @@ class ModalPassData {
         <ion-title>Toolbar 1</ion-title>
       </ion-toolbar>
 
-      <ion-toolbar>
+      <ion-toolbar no-border-top>
         <ion-title>Toolbar 2</ion-title>
       </ion-toolbar>
     </ion-header>
diff --git a/src/components/nav/test/basic/index.ts b/src/components/nav/test/basic/index.ts
index e9fe7916464..e1b9f077366 100644
--- a/src/components/nav/test/basic/index.ts
+++ b/src/components/nav/test/basic/index.ts
@@ -209,6 +209,9 @@ class FullPage {
           <button>S1g</button>
         </ion-buttons>
       </ion-navbar>
+      <ion-toolbar no-border-top>
+        <ion-title>I'm a sub header!</ion-title>
+      </ion-toolbar>
     </ion-header>
 
     <ion-content padding>
@@ -227,8 +230,11 @@ class FullPage {
     </ion-content>
 
     <ion-footer>
-      <ion-toolbar>
-        Footer
+      <ion-toolbar no-border-bottom>
+        I'm a sub footer!
+      </ion-toolbar>
+      <ion-toolbar no-border-top>
+        <ion-title>Footer</ion-title>
       </ion-toolbar>
     </ion-footer>
   `
@@ -281,6 +287,11 @@ class PrimaryHeaderPage {
     </ion-header>
 
     <ion-content>
+
+      <ion-toolbar no-border-top>
+        I'm a sub header in the content!
+      </ion-toolbar>
+
       <ion-list>
 
         <ion-item>
@@ -296,7 +307,17 @@ class PrimaryHeaderPage {
         <button ion-item (click)="setRoot()">setRoot(FirstPage)</button>
         <button ion-item (click)="toggleBackButton()">Toggle hideBackButton</button>
         <button ion-item (click)="setBackButtonText()">Set Back Button Text</button>
+        <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
       </ion-list>
+
+      <ion-toolbar no-border-bottom>
+        I'm a sub footer in the content!
+      </ion-toolbar>
+
+      <ion-toolbar no-border-bottom no-border-top>
+        And I'm a sub footer in the content too!
+      </ion-toolbar>
+
     </ion-content>
 
     <ion-footer>
diff --git a/src/components/searchbar/test/nav/search.html b/src/components/searchbar/test/nav/search.html
index 36fc981e3fa..02b9989023c 100644
--- a/src/components/searchbar/test/nav/search.html
+++ b/src/components/searchbar/test/nav/search.html
@@ -1,10 +1,10 @@
 <ion-header>
 
-  <ion-navbar>
+  <ion-navbar no-border-bottom>
     <ion-title>Searchbar</ion-title>
   </ion-navbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-searchbar primary (ionInput)="getItems($event)" placeholder="Filter Schedules">
     </ion-searchbar>
   </ion-toolbar>
diff --git a/src/components/segment/test/basic/main.html b/src/components/segment/test/basic/main.html
index 131bde130cc..95084d7881f 100644
--- a/src/components/segment/test/basic/main.html
+++ b/src/components/segment/test/basic/main.html
@@ -1,6 +1,6 @@
 <ion-header>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-bottom>
     <ion-segment id="segment" [(ngModel)]="relationship" (ionChange)="onSegmentChanged($event)">
       <ion-segment-button value="friends" (ionSelect)="onSegmentSelected($event)" class="e2eSegmentFriends">
         Friends
@@ -11,7 +11,7 @@
     </ion-segment>
   </ion-toolbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-buttons end>
       <button>
         <ion-icon name="search"></ion-icon>
@@ -117,7 +117,7 @@ <h4>Model style: NgModel</h4>
     </ion-segment>
   </ion-toolbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top no-border-bottom>
     <ion-segment [(ngModel)]="appType" danger>
       <ion-segment-button value="paid">
         Default
@@ -131,7 +131,7 @@ <h4>Model style: NgModel</h4>
     </ion-segment>
   </ion-toolbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-segment [(ngModel)]="appType" dark [disabled]="isDisabled">
       <ion-segment-button value="paid">
         Default
diff --git a/src/components/segment/test/nav/main.html b/src/components/segment/test/nav/main.html
index 3baf281eae5..2b24ac471ee 100644
--- a/src/components/segment/test/nav/main.html
+++ b/src/components/segment/test/nav/main.html
@@ -1,12 +1,12 @@
 <ion-header>
 
-  <ion-navbar>
+  <ion-navbar no-border-bottom>
     <ion-title>
       Segment under Navbar
     </ion-title>
   </ion-navbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-segment [(ngModel)]="signInType">
       <ion-segment-button value="new">
         New
diff --git a/src/components/segment/test/swipe/main.html b/src/components/segment/test/swipe/main.html
index 1b2986ee021..7abcc701f28 100644
--- a/src/components/segment/test/swipe/main.html
+++ b/src/components/segment/test/swipe/main.html
@@ -1,12 +1,12 @@
 <ion-header>
 
-  <ion-navbar>
+  <ion-navbar no-border-bottom>
     <ion-title>
       Segment Swipeable under Navbar
     </ion-title>
   </ion-navbar>
 
-  <ion-toolbar>
+  <ion-toolbar no-border-top>
     <ion-segment [(ngModel)]="selectedSegment" (ionChange)="onSegmentChanged($event)">
       <ion-segment-button value="first">
         First
diff --git a/src/components/select/test/single-value/index.ts b/src/components/select/test/single-value/index.ts
index 3a6d1b58333..d92c58b5dab 100644
--- a/src/components/select/test/single-value/index.ts
+++ b/src/components/select/test/single-value/index.ts
@@ -6,7 +6,7 @@ import {ionicBootstrap} from '../../../../../src';
   templateUrl: 'main.html'
 })
 class E2EPage {
-  musicAlertOpts;
+  musicAlertOpts: any;
   gender: string;
   gaming: string;
   os: string;
@@ -30,17 +30,13 @@ class E2EPage {
       title: '1994 Music',
       subTitle: 'Select your favorite'
     };
-
-    setTimeout(() => {
-      this.gender = 'm';
-    }, 1500);
   }
 
   gamingCancel() {
     console.log('Gaming Select, Cancel');
   }
 
-  gamingChange(selectedValue) {
+  gamingChange(selectedValue: any) {
     console.log('Gaming Select, Change value:', selectedValue);
   }
 
diff --git a/src/components/tabs/test/colors/styles.css b/src/components/tabs/test/colors/styles.css
index 3385d168a44..4855a8f2451 100644
--- a/src/components/tabs/test/colors/styles.css
+++ b/src/components/tabs/test/colors/styles.css
@@ -8,4 +8,5 @@ ion-tabs ion-tabbar {
   top: auto;
   height: auto;
   visibility: visible;
+  opacity: 1;
 }
diff --git a/src/components/tabs/test/tab-bar-scenarios/styles.css b/src/components/tabs/test/tab-bar-scenarios/styles.css
index 3385d168a44..4855a8f2451 100644
--- a/src/components/tabs/test/tab-bar-scenarios/styles.css
+++ b/src/components/tabs/test/tab-bar-scenarios/styles.css
@@ -8,4 +8,5 @@ ion-tabs ion-tabbar {
   top: auto;
   height: auto;
   visibility: visible;
+  opacity: 1;
 }
diff --git a/src/components/toast/test/basic/main.html b/src/components/toast/test/basic/main.html
index 3c0e6002abf..40eded850d4 100644
--- a/src/components/toast/test/basic/main.html
+++ b/src/components/toast/test/basic/main.html
@@ -14,8 +14,8 @@
   <br />
   <button block (click)="showDismissDurationToast()">Custom (1.5s) Duration</button>
   <button block (click)="showToastWithCloseButton('bottom')" class="e2eOpenToast">With closeButtonText</button>
-  <button block (click)="showToastWithCloseButton('top')" class="e2eOpenToast">Top With closeButtonText</button>
-  <button block (click)="showToastWithCloseButton('middle')" class="e2eOpenToast">Middle With closeButtonText</button>
+  <button block (click)="showToastWithCloseButton('top')">Top With closeButtonText</button>
+  <button block (click)="showToastWithCloseButton('middle')">Middle With closeButtonText</button>
 
   <p>
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia purus ac turpis fermentum, nec accumsan nulla rutrum. Aenean lorem est, luctus id iaculis ac, ultricies quis odio. Aenean imperdiet imperdiet ex et vehicula. Suspendisse vulputate turpis quis ultricies porttitor. Proin malesuada tortor at libero laoreet, eu eleifend enim pulvinar. Nulla facilisi. Fusce sit amet mauris mauris. Mauris consequat libero sed egestas tincidunt.
diff --git a/src/components/toolbar/toolbar.ios.scss b/src/components/toolbar/toolbar.ios.scss
index 7395bbd0d02..3607b582423 100644
--- a/src/components/toolbar/toolbar.ios.scss
+++ b/src/components/toolbar/toolbar.ios.scss
@@ -38,41 +38,35 @@ $navbar-ios-height:                         $toolbar-ios-height !default;
 }
 
 
-// iOS Header Toolbar
+// iOS Toolbar Background
 // --------------------------------------------------
 
-ion-header {
-  border: 0;
+.toolbar-background {
+  border-top-width: 1px;
   border-bottom-width: 1px;
   border-style: solid;
   border-color: $toolbar-ios-border-color;
+  background: $toolbar-ios-background;
 }
 
-&.hairlines ion-header {
+&.hairlines .toolbar-background {
+  border-top-width: $hairlines-width;
   border-bottom-width: $hairlines-width;
 }
 
 
-// iOS Footer Toolbar
+// iOS Toolbar Borders
 // --------------------------------------------------
 
-ion-footer {
-  border: 0;
-  border-top-width: 1px;
-  border-style: solid;
-  border-color: $toolbar-ios-border-color;
+ion-header .toolbar:first-child .toolbar-background,
+ion-menu > .toolbar:first-child .toolbar-background,
+.toolbar[no-border-top] .toolbar-background {
+  border-top-width: 0;
 }
 
-&.hairlines ion-footer {
-  border-top-width: $hairlines-width;
-}
-
-
-// iOS Toolbar Background
-// --------------------------------------------------
-
-.toolbar-background {
-  background: $toolbar-ios-background;
+ion-footer .toolbar:last-child .toolbar-background,
+.toolbar[no-border-bottom] .toolbar-background {
+  border-bottom-width: 0;
 }
 
 
diff --git a/src/components/toolbar/toolbar.ts b/src/components/toolbar/toolbar.ts
index f985b0a4417..4078936d373 100644
--- a/src/components/toolbar/toolbar.ts
+++ b/src/components/toolbar/toolbar.ts
@@ -116,14 +116,25 @@ export class ToolbarBase extends Ion {
  * | `left`      | Positions element to the left of all other elements.                                                            |
  * | `right`     | Positions element to the right of all other elements.                                                           |
  *
- * See [usage](#usage) below for some examples.
+ *
+ * ### Multiple Toolbars
+ * Toolbars can be stacked up vertically in `<ion-header>`, `<ion-content>`, and
+ * `<ion-footer>` elements. However, toolbars also come with borders on both
+ * the top and bottom of the toolbar. To give developers full control of the
+ * design, Ionic also includes the `no-border-bottom` and `no-border-top` attributes.
+ * For example, sometimes two vertically stacked toolbars may have different
+ * background colors, in this case it might be best to leave a border between them.
+ * However, if they have the same background color, the app may look best without
+ * a border between them. The main point here is, it's entirely up to the app's design
+ * to decide when and when not to show borders between toolbars, and to do so then
+ * each toolbar can individually set `no-border-bottom` and `no-border-top` attributes.
  *
  *
  * @usage
  * ```html
  * <ion-header>
  *
- *   <ion-toolbar>
+ *   <ion-toolbar no-border-bottom>
  *     <ion-buttons start>
  *       <button>
  *         <ion-icon name="contact"></ion-icon>
@@ -135,7 +146,7 @@ export class ToolbarBase extends Ion {
  *     <ion-title>My Toolbar Title</ion-title>
  *   </ion-toolbar>
  *
- *   <ion-toolbar>
+ *   <ion-toolbar no-border-top>
  *     <ion-title>I'm a subheader</ion-title>
  *   </ion-toolbar>
  *
@@ -153,7 +164,7 @@ export class ToolbarBase extends Ion {
  *
  * <ion-footer>
  *
- *   <ion-toolbar>
+ *   <ion-toolbar no-border-bottom>
  *     <ion-title>I'm a subfooter</ion-title>
  *     <ion-buttons right>
  *       <button>
@@ -162,7 +173,7 @@ export class ToolbarBase extends Ion {
  *     </ion-buttons>
  *   </ion-toolbar>
  *
- *   <ion-toolbar>
+ *   <ion-toolbar no-border-top>
  *     <ion-title>I'm a footer</ion-title>
  *     <ion-buttons end>
  *       <button>
@@ -201,11 +212,20 @@ export class Toolbar extends ToolbarBase {
 
   constructor(
     @Optional() viewCtrl: ViewController,
-    elementRef: ElementRef,
-    config: Config
+    @Optional() header: Header,
+    @Optional() footer: Footer,
+    config: Config,
+    elementRef: ElementRef
   ) {
     super(elementRef);
-    viewCtrl && viewCtrl.setToolbarRef(elementRef);
+
+    if (viewCtrl && (header || footer)) {
+      // only toolbars within headers and footer are view toolbars
+      // toolbars within the content are not view toolbars, since they
+      // are apart of the content, and could be anywhere within the content
+      viewCtrl.setToolbarRef(elementRef);
+    }
+
     this._sbPadding = config.getBoolean('statusbarPadding');
   }