After coming across a question with no answer that suited my needs, I decided to share the solution I created. In my case, I had a hidden generated list on a page which was initially set with a CSS height of "0" and then expanded upon clicking by transitioning the height. However, I encountered an issue where transitions did not work when the height was set to "auto". After some investigation, I found out that the CSS attribute "scrollHeight" would still calculate regardless of the "height" or "max-height" values. So, I assigned the "onclick" event to change the element's height to the "scrollHeight".
document.getElementById('dropContent').style.height = document.getElementById('dropContent').scrollHeight + 'px';