diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
index 99cac99bf..b106b88a5 100644
--- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
+++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
@@ -262,16 +262,17 @@
 		span { display : inline-block; margin  : 0; }
 		.brewTags {
 			display     : inline-flex;
+			flex-wrap   : wrap;
 			grid-area   : tags;
 			align-items : center;
-			width       : fit-content;
-			max-width   : 100px;
-			&:has(span:nth-of-type(4)) {
+			width       : 100%;
+			i, span { margin-right : 5px; }
+			&:has(span:nth-of-type(3)) {
 				position  : relative;
 				display   : flex;
 				flex-wrap : wrap;
 				overflow  : hidden;
-				span:nth-of-type(n + 4) { display : none; }
+				span:nth-of-type(n + 3) { display : none; }
 			}
 		}
 		.brewAuthors {
@@ -323,35 +324,33 @@
 
 //these media queries are just for the list layout and could be moved inside it, not sure it is a good idea
 @media screen and (max-width : 1400px) {
-	.brewCollection .brewGroup {
-		&.list {
-			.brewItem:not(.detailsOpen) {
-				.info {
-					grid-template-areas   : 'tags update storage';
-					grid-template-columns : 2fr 1fr 20px;
-					width                 : clamp(200px, 100%, 650px);
-				}
-				.brewPages,
-				.lastViewed,
-				.brewAuthors { display : none; }
+	.brewCollection .brewGroup.list {
+		.brewItem:not(.detailsOpen) {
+			.info {
+				grid-template-areas   : 'tags update storage';
+				grid-template-columns : 2fr 1fr 20px;
+				width                 : clamp(200px, 100%, 650px);
 			}
-			.brewItem {
-				cursor                : pointer;
-				transition            : height @defaultDuration;
-				&:hover {
-					box-shadow : 0 0 5px var(--bg-clr);
-					filter     : brightness(0.97);
-				}
-			}
-			.detailsOpen {
-				grid-template-columns : 25% 3fr 150px;
-				height                : 70px;
+			.brewPages,
+			.lastViewed,
+			.brewAuthors { display : none; }
+		}
+		.brewItem {
+			cursor                : pointer;
+			transition            : height @defaultDuration;
+			&:hover {
+				box-shadow : 0 0 5px var(--bg-clr);
+				filter     : brightness(0.97);
 			}
 		}
+		.detailsOpen {
+			grid-template-columns : 25% 3fr 150px;
+			height                : 70px;
+		}
 	}
 }
 @media screen and (max-width : 1200px) {
-	.brewCollection .brewGroup .list {
+	.brewCollection .brewGroup.list {
 		.brewItem:not(.detailsOpen) {
 			grid-template-columns : 35% 3fr 150px;
 			.info {
@@ -378,7 +377,7 @@
 	}
 }
 @media screen and (max-width : 800px) {
-	.brewCollection .brewGroup  .list {
+	.brewCollection .brewGroup.list {
 		.brewItem:not(.detailsOpen) {
 			.info {
 				grid-template-areas   : 'tags';
@@ -432,7 +431,7 @@
 	}
 }
 @media screen and (max-width : 650px) {
-	.brewCollection .brewGroup  .list {
+	.brewCollection .brewGroup.list {
 		.brewItem:not(.detailsOpen) {
 			grid-template-columns : 3fr 2fr;
 			.info { display : none; }