添加内容后，Div对齐失败

Question

我有一个以下布局的网页。 左侧的侧边栏是以下css：

.sidebar { 
display: inline-block;  
top: 0;
width: 200px;
height: 1000px;
}

和css右边的内容：

.content { position: relative; display: inline-block; }

但是在添加侧边栏内的任何内容时，布局变为：

侧边栏向下，甚至无法通过更改“顶部”值来提升。

如何在内容的左侧成功对齐侧边栏？

Answer 1

您应该使用vertical-align: top;声明来代替两个内联块列，使它们保持在顶部，如下所示：

.sidebar, .content {
    vertical-align: top;
}

  

<强> 'vertical-align'

     

此属性会影响行框内的垂直定位   由内联级元素生成的框。

     

热门
  将对齐的子树的顶部与线框的顶部对齐。

CSS top属性仅适用于非静态定位元素。它对inline-block或任何其他内联级别元素没有任何影响。

Answer 2

尝试添加vertical-align: top;

Answer 3

尝试使用固定属性：     posistion：fixed

尝试检查oyu内容的宽度，如果它适合这个200px的宽度。

如果你的浏览器上有萤火虫，应该好好地对它进行调配。

Answer 4

您需要使用某种位置规则，否则您的最高值无效。我会用position: absolute;。使用fixed并不理想。