html - Height to 0 hover effect under Firefox -


hy have problem under ff. when try use hover on div transform height 0, working strangely. there way make work under chrome? code is:

css :

#square{     position:fixed;     top:50%;     left:40%;     width:11%;     height:22%;     background-color:blue;     transition:height 0.8s linear;     -webkit-transition:height 0.8s linear;     -moz-transition:height 0.8s linear; }  #square:hover{     height:0%; } 

html:

<div id="square"></div> 

you should wrap div, keep hover when #square div no longer under pointer :

css

#mydiv {     position:fixed;     top:50%;     left:40%;     width:11%;     height:22%; } #mydiv:hover>#square {     height:0%; } 

html

<div id="mydiv">     <div id="square"></div> </div> 

demo jsfiddle


Comments

Popular posts from this blog

java - activate/deactivate sonar maven plugin by profile? -

python - TypeError: can only concatenate tuple (not "float") to tuple -

java - What is the difference between String. and String.this. ? -