html - vertical-align: コンテナー内の上位 2 つのフローティング div

Question

position:考えられるすべての組み合わせを試して、上端に沿って整列させましたが、何もうまくいかないようです#blog。#sidebar何か案は？

CSS:

#blog-container {
    margin: 0 auto;
    width: 960px;
}
#blog {
    float: left;
    margin-top: 80px;
    position: relative;
    width: 620px;
}
#sidebar {
    float: right;
    margin-top: 80px;
    position: relative;
    width: 300px;
}

HTML:

<div id="blog-container">
    <div id="blog">
        <content>
    </div><!-- end blog -->
    <div id="sidebar">
        <content>
    </div><!-- end sidebar -->
</div><!-- end blog-container -->

Answer 1

最初に (HTML に) サイドバーを含めて右にフロートさせ、次にブログを含めて左にフロートさせます。

<div id="blog-container">
    <div id="sidebar">
        <content/>
    </div><!-- end sidebar -->
    <div id="blog">
        <content/>
    </div><!-- end blog -->
</div><!-- end blog-container -->