Divsは並んで表示されませんか？

Question

次のdivが並んで表示されないのはなぜですか？私はそれが次のように見えるようにしようとしているhttp://jsfiddle.net/YxCK4/

...

___________________________ 
| left|     | 
|  |     | 
|  |   main  |  <--- Window. 
|  |     | 
|  |     | 
|-------------------------| 

Answer 1

ブロックレベル要素が自然にお互いに次のサイドませんが、手動でその振る舞いを定義する必要があります。両方のdivをfloat:leftと定義して並べて配置します。

#left, #main { float:left } 

Answer 2

inline-blockまたはfloatそれらleft

Example

として表示<div>年代にこのような何か：divタグはブロックレベル要素です

#window{ 
    width: 90%; 
} 

#left{ 
padding: 10px; 
width: 85px; 
    display: inline-block; 
} 

#main{ 
    display: inline-block; 
} 

Answer 3

、あなたは、インラインを使用する必要がありますCSS floatでスパンやオーバーライドのような要素：left

Answer 4

今のところjsfiddleと言われているように、#leftと#mainの両方のコンテナは浮動小数点数にする必要があります+ floatで取ることができる幅よりも広い場合は、自動的に自動的に下に移動し、正しいものを設定しようとする必要があります。私はこれを追加しました

#left,#main 
{ 
float:left 
} 

#main 
{ 
width:300px; // 90% is not correct here and will not work 
}