diff --git a/ionic/components/segment/segment.ios.scss b/ionic/components/segment/segment.ios.scss
index 9cdbfadf01..3cf7a22996 100644
--- a/ionic/components/segment/segment.ios.scss
+++ b/ionic/components/segment/segment.ios.scss
@@ -46,10 +46,10 @@ $segment-button-ios-toolbar-button-max-width: 100px !default;
     background-color: rgba($segment-button-ios-bg-color-activated, $segment-button-ios-hover-opacity);
     transition: $segment-button-ios-hover-transition;
   }
-  
+
   &:active:not(.segment-activated) {
-      background-color: rgba($segment-button-ios-bg-color-activated, $segment-button-ios-active-opacity);
-      transition: $segment-button-ios-active-transition;
+    background-color: rgba($segment-button-ios-bg-color-activated, $segment-button-ios-active-opacity);
+    transition: $segment-button-ios-active-transition;
   }
 
   &:first-of-type {
@@ -100,7 +100,10 @@ $segment-button-ios-toolbar-button-max-width: 100px !default;
       background-color: rgba($color-value, $segment-button-ios-hover-opacity);
     }
 
-    &.activated,
+    &:active:not(.segment-activated) {
+      background-color: rgba($color-value, $segment-button-ios-active-opacity);
+    }
+
     &.segment-activated {
       color: inverse($color-value);
       background-color: $color-value;
@@ -119,4 +122,4 @@ $segment-button-ios-toolbar-button-max-width: 100px !default;
   .toolbar[#{$color-name}] .segment-button.segment-activated {
     color: $color-value;
   }
-}
\ No newline at end of file
+}