diff --git a/web/source/settings/admin/emoji/detail.js b/web/source/settings/admin/emoji/detail.js
index 266084718..51e291448 100644
--- a/web/source/settings/admin/emoji/detail.js
+++ b/web/source/settings/admin/emoji/detail.js
@@ -81,7 +81,7 @@ function EmojiDetail({emoji}) {
 	}
 
 	React.useEffect(() => {
-		if (category != emoji.category && !categoryState.open && !isNewCategory && emoji.category != undefined) {
+		if (category != emoji.category && !categoryState.open && !isNewCategory && category.trim().length > 0) {
 			console.log("updating to", category);
 			modifyEmoji({id: emoji.id, category: category.trim()});
 		}
diff --git a/web/source/settings/components/fake-profile.jsx b/web/source/settings/components/fake-profile.jsx
index decd65d83..c69e52b76 100644
--- a/web/source/settings/components/fake-profile.jsx
+++ b/web/source/settings/components/fake-profile.jsx
@@ -33,10 +33,10 @@ module.exports = function FakeProfile({}) {
 				<div id="profile-basic-filler2"></div>
 				<span className="avatar"><img className="avatarpreview" src={account.avatar} alt={account.avatar ? `avatar image for ${account.username}` : "None set"} /></span>
 				<div className="displayname">{account.display_name.trim().length > 0 ? account.display_name : account.username}</div>
-				<div class="usernamecontainer">
+				<div className="usernamecontainer">
 					<div className="username"><span>@{account.username}</span></div>
 					{(account.role && account.role != "user") && 
-						<div class={`role ${account.role}`}>{account.role}</div>
+						<div className={`role ${account.role}`}>{account.role}</div>
 					}
 				</div>
 			</div>
diff --git a/web/source/settings/style.css b/web/source/settings/style.css
index 7922a4053..590db1982 100644
--- a/web/source/settings/style.css
+++ b/web/source/settings/style.css
@@ -410,6 +410,7 @@ span.form-info {
 
 		.emoji-group {
 			display: flex;
+			flex-wrap: wrap;
 	
 			a {
 				border-radius: $br;