I'm trying to add a CSS transition on the max-height property of an element, to make it look like it's opening and closing. It's working properly on the opening part, but when I try to close it, it just skips the transition.
I tried applying the "transition: max-height .5s ease-in" line to the element in its opened state as with the closed state, but it doesn't change a thing.
I also tried transitioning the height property instead, but it doesn't change anything either.
Here's the demo, try with screen width below 992px: http://efficience4.com/laloupe/fiche-auteur.html (click on "lire la biographie")
Any ideas as to why it does this and how to fix it ? :)