CSS：两个div并排

如何让绿色/黄色框显示在边栏旁边而不是下面？绿色/黄色部分应该是100％的宽度。CSS：两个div并排

Screensho

这里是我的源代码： 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; 
}

来源

2014-01-19 TupidaMC - DEV

给这个CSS代码一试，我加了float财产。你也可以在这里使用这个jsfiddle，看看我改变了什么。
你也想看看的链接和尖端（约结算），其@Ian克拉克在给予：micro clearfix hack

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

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

更多有关float检查：

Float

来源

2014-01-19 00:59:53 ztirom

http://www.w3fools.com/ :) –

任何其他谷歌搜索也会做到这一点，是的。 ;） – ztirom

顺便说一句我只是看着你的代码。你不需要'float'头部有一个'position'或者'width' [（见JSFiddle）]（http://jsfiddle.net/AVY7T/7/） –

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

来源

2014-01-19 01:06:28 Hiigaran

this ^^^^^^^^^^^ – thatOneGuy

CSS：两个div并排

回答

相关问题