Em có một dãy các floated element trong một thẻ div, vậy làm sao để có thể hiện scrollbar khi tổng chiều dài của các element vượt quá chiều dài của thẻ div(tức là các floated element không xuống dòng). Đây là code của em ạ: 

HTML:

<div id="hoc">
    <div class="tki">
        <p>Tên thời kì</p>
        <div class="sukiend">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukienc">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="clear"></div>
    </div>
    <div class="tki">
        <p>Tên thời kì</p>
        <div class="sukiend">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukien">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="sukienc">
            <img class="minhhoa"/>
            <p>Tên sự kiện</p>
        </div>
        <div class="clear"></div>
    </div>
</div>

CSS

.sukien{
    width:20%;
    float:left;
    margin-right:4%;
    text-align:center;
    height:auto;
}

.sukienc{
    width:20%;
    float:left;
    margin-right:0;
    text-align:center;
    height:auto;
}

.sukiend{
    width:20%;
    float:left;
    margin-right:4%;
    margin-left:4%;
    text-align:center;
    height:auto;
}

.minhhoa{
    width:100%;
    height:140px;
    background-color:white;
    box-shadow: 0px 2px 4px 0 rgba(0,0,0,0.2);
    margin-bottom:10px;
}

.sukien p, .sukienc p, .sukiend p{
    display:inline;
}

.tki{
    overflow-x:auto;
    box-shadow: 0px 3px 6px 0 rgba(0,0,0,0.2);
    padding: 20px 0px;
    box-sizing:border-box;
    height:auto;
    width:100%;
    background-color:white;
    margin-bottom:50px;
}

.tki > p{
    margin:0;
    margin-left:4%;
    margin-bottom:10px;
    padding:0;
}