右对齐div

Question

我正在尝试将div对齐，但它只显示在底部。

Issue

CSS：

.homeWrapper{
    padding: 12px;
    width:auto;
}
.content_inner{
    height: auto;
    background-color: #6c93b8;
    margin:12px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    clear:both;
}
.leftCol{
    display: inline-block;
    width:448px;
    background-color: red;
}
.rightCol{
    display: inline-block;
    width:430px;
    background-color: green;
    clear:both;
}

HTML：

    <div class="homeWrapper">
            <div class="content_inner">
                <h1><span class="color_red">Contact</span> Agrilife</h1>
                    <div class="leftCol">
                        {{ template:body }}
                    </div>
                    <div class="rightCol">
                        text
                        text
                        text

                    </div>  
        </div>
    </div>  

Answer 1

尝试使用float

.leftCol{
    float:left;
    width:448px;
    background-color: red;
}
.rightCol{
    float:right;
    width:430px;
    background-color: green;
    clear:both;
}

Answer 2

将float:right;与.rightCol

一起使用