some fixes to online page

public/src/forum/users.js

@@ -60,7 +60,7 @@ define(function() {
 			var html = templates.prepare(templates['users'].blocks['users']).parse({
 				users: data
 			}),
-				userListEl = document.querySelector('#users-container');
+				userListEl = document.querySelector('#users-inner-container');
 
 			userListEl.innerHTML = html;
 
@@ -77,7 +77,7 @@ define(function() {
 
 		socket.on('api:user.isOnline', function(data) {
 			if(active == 'online' && !loadingMoreUsers) {
-				$('#users-container .registered-user').remove();
+				$('#users-inner-container').empty();
 				startLoading('users:online', 0);
 				socket.emit('api:user.getOnlineAnonCount', {} , function(anonCount) {
 					$('#online_anon_count').html(anonCount);
@@ -89,7 +89,7 @@ define(function() {
 			var html = templates.prepare(templates['users'].blocks['users']).parse({
 				users: users
 			});
-			$('#users-container').prepend(html);
+			$('#users-inner-container').append(html);
 		}
 
 		function loadMoreUsers() {
@@ -105,7 +105,7 @@ define(function() {
 			}
 
 			if (set) {
-				startLoading(set, $('#users-container').children().length);
+				startLoading(set, $('#users-inner-container').children().length);
 			}
 		}
 

public/templates/users.tpl

@@ -19,26 +19,28 @@
 	</div>
 
 	<ul id="users-container" class="users-container">
-		<!-- BEGIN users -->
+		<div id="users-inner-container" class="inline-block">
-		<div class="users-box registered-user">
+			<!-- BEGIN users -->
-			<a href="/user/{users.userslug}">
+			<div class="users-box registered-user">
-				<img src="{users.picture}" class="img-thumbnail"/>
+				<a href="/user/{users.userslug}">
-			</a>
+					<img src="{users.picture}" class="img-thumbnail"/>
-			<br/>
+				</a>
-			<div class="user-info">
-				<a href="/user/{users.userslug}">{users.username}</a>
 				<br/>
-				<div title="reputation" class="reputation">
+				<div class="user-info">
-					<span class='formatted-number'>{users.reputation}</span>
+					<a href="/user/{users.userslug}">{users.username}</a>
-					<i class='icon-star'></i>
+					<br/>
-				</div>
+					<div title="reputation" class="reputation">
-				<div title="post count" class="post-count">
+						<span class='formatted-number'>{users.reputation}</span>
-					<span class='formatted-number'>{users.postcount}</span>
+						<i class='icon-star'></i>
-					<i class='icon-pencil'></i>
+					</div>
+					<div title="post count" class="post-count">
+						<span class='formatted-number'>{users.postcount}</span>
+						<i class='icon-pencil'></i>
+					</div>
 				</div>
 			</div>
+			<!-- END users -->
 		</div>
-		<!-- END users -->
 		<div class="users-box {show_anon}">
 			<a href="#">
 				<img src="" class="img-thumbnail"/>