diff --git a/public/css/style.less b/public/css/style.less
index 0cf52a6dfd..6a93c9c4de 100644
--- a/public/css/style.less
+++ b/public/css/style.less
@@ -759,7 +759,12 @@ body .navbar .nodebb-inline-block {
 #notif-list {
 	li {
 		font-size: 12px;
-		width: 200px;
+		width: 300px;
+		text-align: left;
+
+		a {
+			white-space: normal;
+		}
 
 		&.unread {
 			background: #eceff5;
diff --git a/public/templates/footer.tpl b/public/templates/footer.tpl
index 20969e8426..4e4b9671b0 100644
--- a/public/templates/footer.tpl
+++ b/public/templates/footer.tpl
@@ -129,6 +129,10 @@
 			if (counts.unread > 0) notifIcon.className = 'icon-circle active';
 			else notifIcon.className = 'icon-circle-blank';
 		});
+		socket.on('event:new_notification', function() {
+			console.log('WOOT');
+			document.querySelector('.notifications a i').className = 'icon-circle active';
+		});
 		socket.emit('api:notifications.counts');
 	}());
 	</script>
diff --git a/public/templates/header.tpl b/public/templates/header.tpl
index 9ecec06713..9992ba10ba 100644
--- a/public/templates/header.tpl
+++ b/public/templates/header.tpl
@@ -47,7 +47,7 @@
 						</li>
 					</ul>
 					<ul class="nav pull-right nodebb-inline-block" id="right-menu">
-						<li class="notifications dropdown">
+						<li class="notifications dropdown text-center">
 							<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="notif_dropdown"><i class="icon-circle-blank"></i></a>
 							<ul id="notif-list" class="dropdown-menu" aria-labelledby="notif_dropdown">
 								<li><a href="#"><i class="icon-refresh icon-spin"></i> Loading Notifications</a></li>
diff --git a/src/notifications.js b/src/notifications.js
index 3eb6ff4dd2..8ea7dc9f24 100644
--- a/src/notifications.js
+++ b/src/notifications.js
@@ -55,6 +55,7 @@ var	config = require('../config.js'),
 					(function(uid) {
 						Notifications.remove_by_uniqueId(notif_data.uniqueId, uid, function() {
 							RDB.zadd('uid:' + uid + ':notifications:unread', notif_data.score, nid);
+							global.io.sockets.in('uid_' + uid).emit('event:new_notification');
 							if (callback) callback(true);
 						});
 					})(uids[x]);
diff --git a/src/websockets.js b/src/websockets.js
index e9cac41eae..5db88cb5e8 100644
--- a/src/websockets.js
+++ b/src/websockets.js
@@ -1,5 +1,5 @@
 
-var SocketIO = require('socket.io').listen(global.server,{log:false}),
+var SocketIO = require('socket.io').listen(global.server, { log:false }),
 	cookie = require('cookie'),
 	connect = require('connect'),
 	config = require('../config.js'),
@@ -58,6 +58,7 @@ var SocketIO = require('socket.io').listen(global.server,{log:false}),
 		userSockets[uid].push(socket);
 		user.go_online(uid);
 		
+		socket.join('uid_' + uid);
 		
 		/*process.on('uncaughtException', function(err) {
     		// handle the error safely