diff --git a/internal_packages/notifications/lib/activity-sidebar.cjsx b/internal_packages/notifications/lib/activity-sidebar.cjsx
index 47efa997c..80a160118 100644
--- a/internal_packages/notifications/lib/activity-sidebar.cjsx
+++ b/internal_packages/notifications/lib/activity-sidebar.cjsx
@@ -36,15 +36,27 @@ class ActivitySidebar extends React.Component
 
     names = classNames
       "sidebar-activity": true
-      "sidebar-activity-empty": items.length is 0
       "sidebar-activity-error": error?
 
+    wrapperClass = "sidebar-activity-transition-wrapper "
+
+    if items.length is 0
+      wrapperClass += "sidebar-activity-empty"
+    else
+      inside = <TimeoutTransitionGroup
+        className={names}
+        leaveTimeout={625}
+        enterTimeout={125}
+        transitionName="activity-opacity">
+        {items}
+      </TimeoutTransitionGroup>
+
     <TimeoutTransitionGroup
-      className={names}
+      className={wrapperClass}
       leaveTimeout={625}
       enterTimeout={125}
-      transitionName="activity-item">
-      {items}
+      transitionName="activity-opacity">
+        {inside}
     </TimeoutTransitionGroup>
 
   _renderSyncActivityItem: =>
diff --git a/internal_packages/notifications/stylesheets/notifications.less b/internal_packages/notifications/stylesheets/notifications.less
index 19f475b17..ac06a4917 100644
--- a/internal_packages/notifications/stylesheets/notifications.less
+++ b/internal_packages/notifications/stylesheets/notifications.less
@@ -1,10 +1,20 @@
 @import "ui-variables";
 @import "ui-mixins";
 
+.sidebar-activity-transition-wrapper {
+  order: 2;
+
+  &.sidebar-activity-empty {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+  }
+}
+
 .sidebar-activity {
+  display: block;
   width: 100%;
   bottom: 0;
-  order:2;
   background: @background-off-primary;
   font-size: @font-size-small;
   color: @text-color-subtle;
@@ -41,7 +51,7 @@
         background-color: @background-color-info;
       }
     }
-    // TODO: Necessary for Chromium 42 to render `activity-item-leave` animation
+    // TODO: Necessary for Chromium 42 to render `activity-opacity-leave` animation
     // properly. Removing position relative causes the div to remain visible
     position:relative;
     opacity: 1;
@@ -56,22 +66,22 @@
   }
 }
 
-.activity-item-enter {
+.activity-opacity-enter {
   opacity:0;
   transition: opacity .125s ease-out;
 }
 
-.activity-item-enter.activity-item-enter-active {
+.activity-opacity-enter.activity-opacity-enter-active {
   opacity:1;
 }
 
-.activity-item-leave {
+.activity-opacity-leave {
   opacity:1;
   transition: opacity .125s ease-in;
   transition-delay: 0.5s;
 }
 
-.activity-item-leave.activity-item-leave-active {
+.activity-opacity-leave.activity-opacity-leave-active {
   transition-delay: 0.5s;
   opacity:0;
 }