Html div不会并排出现吗？

为什么下列div不会并排出现

我试着让它看起来像下面

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

___________________________
|左||
|     |                   | 
|| main |块级元素不会自然地并排排列，您必须手动定义该行为。只需将两个div定义为
float:left
，将它们并排放置，例如

#left, #main { float:left }

将
显示为
内联块
或
浮点
它们
左


大概是这样的：

#window{
    width: 90%;
}

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

#main{
    display: inline-block;
}

div是块级元素，您需要使用内联元素，比如span或override与CSS float:left
现在，正如其他人所说，容器#left和#main都需要浮动+如果宽度大于float中的可用空间，则不能分配90%的宽度，它将自动向下移动，并且必须首先尝试将其设置为正确。我加了这个

#left,#main 
{
float:left
}

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

因为默认情况下div是块级元素。您需要使用css float使诸如div之类的块元素彼此相邻。这是你的小提琴的更新，上面显示：@TJ。您不需要使用浮动，但它们是实现这一点最常用的技术之一。我建议，如果您想进一步使用HTML和CSS，请完成一些教程。网上有很多这样的东西。如果你不想让自己熟悉最基本的概念，我们就不能真正帮助你。@ BZMeGaKAPA：我很清楚这一点，正如我意识到显示的缺点：内联和显示：内嵌块，我不认为是这个问题的解决方案。