Chat message sizes are now flexible to allow resizing + account for delayed emote loading

horizontal-chat/script.js

@@ -1083,7 +1083,11 @@ function AddMessageItem(element, elementID, platform, userId) {
 		messageList.appendChild(lineItem);
 		setTimeout(function () {
 			lineItem.className = lineItem.className + " show";
-			lineItem.style.width = calculatedWidth;
+			lineItem.style.maxWidth = calculatedWidth;
+			// After it's done animating, remove the width constraint in case the div needs to get longer
+			setTimeout(function () {
+				lineItem.style.maxWidth = "none";
+			}, 1000);
 		}, 10);
 
 		// Remove old messages that have gone off screen to save memory

horizontal-chat/style.css

@@ -103,7 +103,7 @@ html {
 li {
 	list-style: none;
 	overflow: hidden;
-	width: 0px;
+	max-width: 0px;
 	transition: all 1s ease-in-out;
 }
 

multichat-overlay/script.js

@@ -1811,7 +1811,11 @@ function AddMessageItem(element, elementID, platform, userId) {
 		messageList.appendChild(lineItem);
 		setTimeout(function () {
 			lineItem.className = lineItem.className + " show";
-			lineItem.style.height = calculatedHeight;
+			lineItem.style.maxHeight = calculatedHeight;
+			// After it's done animating, remove the height constraint in case the div needs to get bigger
+			setTimeout(function () {
+				lineItem.style.maxHeight = "none";
+			}, 1000);
 		}, 10);
 
 		// Remove old messages that have gone off screen to save memory

multichat-overlay/style.css

@@ -61,7 +61,7 @@ html {
 li {
 	list-style: none;
 	overflow: hidden;
-	height: 0;
+	max-height: 0;
 	margin: 10px 0px 0px 0px;
 	transition: all 1s ease-in-out;
 }