diff --git a/css/styles.scss b/css/styles.scss
index 6c60aac58..725a962ee 100644
--- a/css/styles.scss
+++ b/css/styles.scss
@@ -43,6 +43,8 @@
 	.notification-wrapper {
 		display: flex;
 		flex-direction: column;
+		margin-bottom: 44px;
+		max-height: calc(100vh - 50px * 4 - 44px) !important;
 	}
 
 	.emptycontent {
@@ -58,6 +60,10 @@
 		color: var(--color-text-maxcontrast);
 		border-top: 1px solid var(--color-border);
 		padding: 10px;
+		width: calc(100% - 10px * 2);
+		position: absolute;
+		bottom: 0px;
+		background-color: var(--color-main-background);
 
 		&:hover,
 		.icon-close {
diff --git a/src/App.vue b/src/App.vue
index 760371ad3..02cbee904 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -30,7 +30,7 @@
 							:object-type="n.object_type"
 							@remove="onRemove" />
 					</transition-group>
-					<li v-if="notifications.length > 2">
+					<li v-if="notifications.length > 0">
 						<div class="dismiss-all" @click="onDismissAll">
 							<span class="icon icon-close svg" :title="t('notifications', 'Dismiss all notifications')" /> {{ t('notifications', 'Dismiss all notifications') }}
 						</div>