2

我正在尝试在我的网站上放置一个浮动菜单，该菜单位于浏览器的中心。

滚动条

我已经制作了静态 div“位置：固定”并设置了“左：0”。我希望静态 div 和其余滚动内容之间的差距保持不变。我尝试将两个 div 包装在一个居中对齐的父 div 中，但这不起作用。

你知道如何做到这一点吗？

4

3 回答 3

3

我认为这就是您想要的...固定的 div 只是您所期望的固定位置。滚动有一个左边距，可以将其从固定的边缘推开一定的量（改变它来改变间隙）。然后有一个包装器 div，如您在问题中所说的那样居中，将它们全部放在页面中间。

演示

HTML

<div id="wrap">
  <div id="fix">test</div>
  <div id="scr">test<br /></div>
</div>

CSS

#wrap {
  width: 500px;
  background-color:#F00;
  margin: 0 auto;
}
#fix {
  border: 1px solid #ccc;
  height: 100px;
  width: 200px;
  position: fixed;
}

#scr {
  border: 1px solid #000;
  margin-left: 220px;
  position: relative;
}
于 2012-08-07T17:05:17.693 回答
1

好吧，我迟到了，但你可以像这样设置 body 标签：

body {
    margin-left: 200px;
}

jsFiddle 示例

于 2012-08-07T17:08:34.617 回答
0

由于您对 div 的宽度及其位置一无所知，我可以建议一个非常简单的解决方案：静态 div 必须具有固定宽度和滚动宽度 - 左侧边距等于静态宽度加上某个值（间隙宽度）

div#static
{
   width: 200px;
   ...
}


div#scrolling
{
   margin-left:180px;
   ...
}

间隙将具有 20px 的恒定值

于 2012-08-07T17:04:00.547 回答