CSS：在相对 div 旁边固定 div答案

【问题标题】：CSS: fixed div next to relative divCSS：在相对 div 旁边固定 div
【发布时间】：2014-10-30 07:12:24
【问题描述】：

我正在尝试制作一个与滚动 div 相邻的固定 div，例如 Fixed div next to a centered div 询问。我看过那个和Fixed div next to parent div，但它似乎不适用于我正在做的事情。这是我正在处理的代码（没有任何我正在尝试制作的代码）：http://jsfiddle.net/Firedrake969/dbLt9/

我试过了

float:left;

但它不适用于

position:fixed;

此外，在切线上，背景 div 是固定的，不允许您滚动页面。

【问题讨论】：

您的演示中没有可滚动的内容。
这是问题的一部分...
移除位置：固定；背面。那么它应该可以工作了。
滚动时会产生空白：prntscr.com/49zewa
Fixed position div scrollable的可能重复

标签： css

【解决方案1】：

FIDDLE在这里
^ 以上是您的代码的更新链接。

讨论：
您不需要在#back div 中定义height 和position。只需将它们从 CSS 中删除即可。您可能会看到浏览器本身添加的自动边距。将此集margin: 0; 覆盖为body。

同样在你的#intro div 上，你正在使用top: 20px;，这使得这个 div 溢出它的父级。相反，您可以使用margin-top: 20px;

【讨论】：

谢谢！让菜单 div 留在中心列旁边怎么样？另一个例子是这样的：barungbiru.neocities.org（尝试调整它的大小）
它仍然留下空白，但在不同的区域：firedrake969.github.io
我在您的网站上没有看到任何空白。
是的，我修好了。关于我的第一个问题的任何想法？（将菜单 div 保持在居中列旁边）
在#back div 上设置宽度并将#intro 向右浮动。目前您正在使用 JS 隐藏菜单。

【解决方案2】：

请尝试一下。

jsfiddle

或者，也许你想要这个：jsfiddle

#top {
    text-align:center;
    background: aliceblue;
    position: fixed;
    width:100%;
    top:0;
    height: 30px;
}
#menu {
    background-color:#8F8E94;        
    font-size:35px;
    margin-top:30px;
}

<div id='top'>Welcome!</div>
<div id='menu'>
Menu <br>
Lorem ipsum dolos accusata pericula. Nonumy saperet alienum per ne, an nam mutat autem, vel diam evertitur sadipscing eu. Errem graece cotidieque an pri. Per et idque populo luptatum.
<br>
Lorem ipsum dolos accusata pericula. Nonumy saperet alienum per ne, an nam mutat autem, vel diam evertitur sadipscing eu. Errem graece cotidieque an pri. Per et idque populo luptatum.
<br>
Lorem ipsum dolos accusata pericula. Nonumy saperet alienum per ne, an nam mutat autem, vel diam evertitur sadipscing eu. Errem graece cotidieque an pri. Per et idque populo luptatum.
<br>
Lorem ipsum dolos accusata pericula. Nonumy saperet alienum per ne, an nam mutat autem, vel diam evertitur sadipscing eu. Errem graece cotidieque an pri. Per et idque populo luptatum.

</div>

【讨论】：