diff --git a/horizontal-chat/script.js b/horizontal-chat/script.js index f4c4590..ec144a9 100644 --- a/horizontal-chat/script.js +++ b/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 diff --git a/horizontal-chat/style.css b/horizontal-chat/style.css index 747c458..6acc4bd 100644 --- a/horizontal-chat/style.css +++ b/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; } diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index b217b36..7153cf0 100644 --- a/multichat-overlay/script.js +++ b/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 diff --git a/multichat-overlay/style.css b/multichat-overlay/style.css index 0a7b81a..c22db5f 100644 --- a/multichat-overlay/style.css +++ b/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; }