Generally when people are trying to animate display: none what they really want is:
Most popular answers use visibility, which can only achieve the first goal, but luckily it's just as easy to achieve both by using position.
Since position: absolute removes the element from typing document flow spacing, you can toggle between position: absolute and position: static (global default), combined with opacity. See the below example.
.content-page {_x000D_
position:absolute;_x000D_
opacity: 0;_x000D_
}_x000D_
_x000D_
.content-page.active {_x000D_
position: static;_x000D_
opacity: 1;_x000D_
transition: opacity 1s linear;_x000D_
}