Question

选中my website，然后查看Divisions left菜单。当你最大化你的broswer没有问题，但当你将它恢复到屏幕的一半时，左侧菜单重叠到右侧。

这是CSS code。有人能帮助我吗？

Answer 1

这是因为你的“divisions”div绝对定位。

您可以删除“position：absolute”并将“divisions”div的宽度增加到300px。

Answer 2

当窗口大小太窄时，您的左侧菜单绝对定位，这就是它重叠其他内容的原因。但是这个问题的解决方案非常棘手，实际上取决于你想要实现的目标。

<强>百分比
一种可能的解决方案是在“divisions”和“content”div上设置width百分比。这样他们永远不会重叠。但这取决于你是否可以为你的“内容”div提供动态宽度。

<强>重新定位
如果您的内容必须是固定的宽度...当窗口太窄（甚至可能比内容宽度窄）时，您首先要确定您希望内容/菜单显示的方式......并且从那里开始工作。

正文元素宽度
设置最小窗口内容（如<body>）宽度。通过使用：

文档开头的透明图片 <img src="t.gif" width="1250">
设置正文的最小宽度css为 min-width: 1250px; 必须为1250px宽，因为内容位于中心位置，因此它必须在左侧和右侧具有相等的空间（右侧是无用的空白空间只允许内容左侧的非重叠空间）

最后一个实际上是最简单的并且有效。它只对较小的屏幕尺寸有点宽，但你的内容宽度（包括左边的菜单）已经超过了1030px ......

Answer 3

非常简单直接和快速解决方案将与CSS：

#content {style.css (line 17)
  left:-270px;
  margin:0 auto;
  padding:30px 10px 0 550px;
  position:relative;
  width:780px;
}

我在我的Firebug中试过这个并且它工作正常。希望它能满足你的需求：）

下次只使用css浮点数：将侧面菜单和内容div放在包装器中，
float：左边是菜单，给包装器一个固定的宽度，中心对齐它。你也可以让导航菜单从左边“向外”，左侧定位它。