Родительский рост не следует за их плавающими детьми [дубликаты]

На этот вопрос уже есть ответ здесь:

Плавающие элементы внутри div, плавающие вне div. Почему? 9 ответов

Мой рост mainContainer не соответствует ширине их детей

и вот мой код у вас есть какие-либо предложения, пожалуйста, сообщите.

Мне нужно решение CSS, а не JavaScript, поэтому спасибо заранее

<div id="mainContainer">
    <div id="leftContent">

    </div>

    <div id="rightContent">

    </div>
</div>

а вот мой css

#mainContainer{
    width: 1000px;
    /*height: 1000px;*/
    height:auto;
    margin-left:auto;
    margin-right:auto;
    background-color: #ff6600;
    padding-bottom: 20px;
}
#leftContent{
    height: 100px;
    float: left;
    width: 380px;
    background-color: violet;
}
#rightContent{
    height: 100px;
    float: right;
    width: 620px;
    background-color: yellow;
}

Ответы на вопрос(3)

Ваш ответ на вопрос