Отображение перехода CSS: блок

Question

Я посмотрел на другую тему, и я сделал то же самое: добавьте прописку, высоту, непрозрачность.

Но у меня нет перехода с css выше. Можешь мне сказать почему ?

Когда я прикасаюсь к кнопке он добавляет класс .Show к моему сНу contactEmote:

#contactEmote{ 
    display: none; 
    top: 0px; 
    background-color: #f65b61; 
    width: 100%; 
    z-index: 2000; 

    opacity:0; 
    clear: both; 
    height: 0px; 
    padding: 0 8px; 
    overflow: hidden; 

    -webkit-transition: all .3s ease .15s; 
    -moz-transition: all .3s ease .15s; 
    -o-transition: all .3s ease .15s; 
    -ms-transition: all .3s ease .15s; 
    transition: all .3s ease .15s; 


    -webkit-box-shadow: 0px 4px 35px -1px rgba(0,0,0,0.68); 
    -moz-box-shadow: 0px 4px 35px -1px rgba(0,0,0,0.68); 
    box-shadow: 0px 4px 35px -1px rgba(0,0,0,0.68); 
} 

#contactEmote.show{ 
    top: 0px; 
    display: block; 
    height: 100px; 
    opacity: 1; 
    padding: 8px; 
} 

Answer 1

Вы не можете переходить элементы, если вы переключаясь между displayblock и none. Попробуйте изменить эти правила на visibility: hidden и visibility: visible.