re: Using CSS Transitions on the Height Property VIEW POST


Hey Great article.
Your solution for when you don't know the height will delay the transition if for example the max-height is transitioning from a higher value than the actual height there is no noticeable change until the max-height reaches the height of the element.

As of now I haven't discovered a better solution for when you don't know the height.

            background: green;
            transition: max-height 5000ms linear;
            overflow: hidden;

            max-height:1000px; /* if the actual height is 800px it won't 
                                look like it's transitioning for the first 200px */

        <div onclick="this.classList.toggle('moved');" id='box'>Moving Box</div>
code of conduct - report abuse