CSS：两个，divs并排

Question

如何让绿色/黄色框显示在侧边栏旁边而不是下方？ 绿色/黄色部分应为100％宽度。

这是我的源代码： 的 HTML

    <div id="sidebar">

    </div>

    <div class="header">

    </div>

CSS

#sidebar{
    background-color: #404040;
    height: 100%;
    width: 50px;
}

.header{
    margin-left: 50px;
    width: 100%;
    height: 200px;
    background-color: #808000;
}

Answer 1

将display:inline-block添加到#sidebar和.header

Answer 2

尝试使用此 CSS 代码，我添加了float属性。你也可以在这里使用这个jsfiddle，看看我改变了什么 您还想看一下@Ian Clark在评论中提供的链接和提示（关于清算）：micro clearfix hack

#sidebar{
    background-color: #404040;
    height: 100%;
    width: 50px;
    float: left;
}

.header{
    margin-left: 50px;
    height: 200px;
    background-color: #808000;
} 

有关float检查的详细信息：

• Float