The problem of element drift during css layout_html/css_WEB-ITnose

I am a newbie. When I use CSS to position, some elements drift inexplicably, which makes me very painful. I would like to ask someone to give me some guidance. Here is a piece of code that I used to explain this problem. The red marked part is the problem. Focus, when I comment out the ul float, his parent element second will create a gap with first. Where does this gap come from, and what is its connection with this float. Furthermore, why does the ul element drift downward a little distance as a whole? Is there any way to properly solve this problem? This is just an example. I have encountered many similar problems. Obviously, the size is fine. The parent element is filled, but it is not satisfied and will drift downwards. Please give me some advice

< ;div class="firstchild">

#">List

List

List

List

List