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並排

回答

相關問題