ul li yapısı ile float lefti li'ye verince div'in height değeri kaçıyor yardımcı olur musunuz?

<div id="box1">
            <ul id="box2">
                <li>deneme</li>
                <li>deneme</li>
                <li>deneme</li>
                <li>deneme</li>
                <li>deneme</li>
                <li>deneme</li>
            </ul>
        </div>

#box1{
    width: 100%;
    height: auto;
background-color: #000;
}
#box2{
    list-style: none;
    width: 75%;
    margin: auto;
}
#box2 li{
    width: 250px;
    margin: 0;
    float: left;
}

Sonuç:
https://ibb.co/XpRTBNT
https://ibb.co/wdC5BCr