diff --git a/ionic/components/search-bar/modes/ios.scss b/ionic/components/search-bar/modes/ios.scss
index 55d826173f..192b513c1c 100644
--- a/ionic/components/search-bar/modes/ios.scss
+++ b/ionic/components/search-bar/modes/ios.scss
@@ -82,7 +82,7 @@ ion-search-bar {
 .search-bar-cancel {
   @extend button[clear];
   transition: $search-bar-ios-cancel-transition;
-  min-height: 0;
+  min-height: 30px;
 
   padding-left: 8px;
   padding-right: 0;
@@ -99,14 +99,6 @@ ion-search-bar {
   }
 }
 
-.search-bar-cancel {
-  @extend button[clear];
-  transition: $search-bar-ios-cancel-transition;
-  padding-left: 8px;
-  min-height: 0;
-  padding-right: 0;
-}
-
 &.hairlines ion-search-bar {
   border-bottom-width: 0.55px;
 }
diff --git a/ionic/components/search-bar/test/floating/main.html b/ionic/components/search-bar/test/floating/main.html
index a9390091ed..c30254b08c 100644
--- a/ionic/components/search-bar/test/floating/main.html
+++ b/ionic/components/search-bar/test/floating/main.html
@@ -9,7 +9,7 @@
   <ion-search-bar [(ng-model)]="defaultCancel" show-cancel="true" class="e2eDefaultCancelButtonFloatingSearchBar"></ion-search-bar>
 
   <h5 padding-left> Search - Custom Cancel Button </h5>
-  <ion-search-bar [(ng-model)]="customCancel" show-cancel="true" cancel-text="Done" class="e2eCustomCancelButtonFloatingSearchBar"></ion-search-bar>
+  <ion-search-bar [(ng-model)]="customCancel" show-cancel="true" cancel-text="Really Long Cancel" class="e2eCustomCancelButtonFloatingSearchBar"></ion-search-bar>
 
   <h5 padding-left> Search - Custom Cancel Action</h5>
   <ion-search-bar [(ng-model)]="customCancelAction" show-cancel="true" cancel-text="Done" [cancel-action]="myCancelAction" class="e2eCustomCancelActionFloatingSearchBar"></ion-search-bar>