How to let the mouse move in.

bold text
how to make the height of the parentDIV become 200px after the mouse is moved into the sonDIV, and the height is also 200px after the mouse is moved into the parentDIV, and height is restored after moving out of the parentDIV

<div id="parent" width="100px" height="50px" >
    <div id="son" width="100px" height="50px"></div>
</div>  
Mar.01,2021

mouseentermouseleave:
var parent=document.getElementById('parent');
parent.onmouseenter=function(){
    this.style.height=200+'px'
}
parent.onmouseleave=function(){
    this.style.height=50+'px'
}
:
 <div id="parent" style="width:100px;height:50px">

1: do not write inline style, the weight is too high, CSS will not be affected.
2:
< style >

can be solved with css.
    -sharpparent{
        height: 50px;
        background: red;
    }
    -sharpson{
        height: 30px;
        background: blue;
    }
    -sharpparent:hover{
        height: 200px;
    }
    -sharpson:hover -sharpparent{
        height: 200px;
    }
</style>
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb6273-25b1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb6273-25b1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?