Html 我怎样才能按下页面的页脚，使其始终向左换行？

我制作了一个页面，左侧有一个菜单，页面其余部分有一些内容，底部有一个页脚

如果我有一堵很大的文本墙作为内容，那么一切都会完美地运行，因为这将向下推动页脚，使页脚环绕菜单向左。这样，一切看起来和工作完全符合我的要求

但是，当内容只是一个小段落时，，页脚推得不够，只是挂在菜单的右侧，就像内容一样

下面是我的问题的一个例子：

*{
边界：0；
保证金：0；
填充：0；
}
#菜单框{
左边距：5px；
边缘顶部：5px；
背景色：#E0；
浮动：左；
溢出：自动；
宽度：120px；
}
#菜单框。菜单类别{
字体大小：粗体；
左侧填充：10px；
边框底部：1px实心#000000；
}
#菜单框。菜单项{
左侧填充：20px；
文字装饰：无；
}
#菜单框。菜单项a{
文字装饰：无；
}
#菜单框。菜单项a：悬停{
文字装饰：下划线；
}
#菜单框。已选择{
字体大小：粗体；
颜色：#000000；
}
#内容
{
边缘底部：15px；
左边距：140像素；
}
#页脚{
边缘底部：10px；
填充：10px；
边框顶部：1px实心#9090；
}

第一节



第二节

项目2





第三节







这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容

这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容

这是/应该是站点的页脚


但它太高，太多的页面右侧，因为内容不足以使其进入菜单下

---

这就是你需要的。在css中编辑#页脚，并用

clear:both更新它。这将使它呈现在所有浮动元素的下方，在本例中是左侧菜单。
只需在

之前添加



*{
边界：0；
保证金：0；
填充：0；
}
#菜单框{
左边距：5px；
边缘顶部：5px；
背景色：#E0；
浮动：左；
溢出：自动；
宽度：120px；
}
#菜单框。菜单类别{
字体大小：粗体；
左侧填充：10px；
边框底部：1px实心#000000；
}
#菜单框。菜单项{
左侧填充：20px；
文字装饰：无；
}
#菜单框。菜单项a{
文字装饰：无；
}
#菜单框。菜单项a：悬停{
文字装饰：下划线；
}
#菜单框。已选择{
字体大小：粗体；
颜色：#000000；
}
#内容
{
边缘底部：15px；
左边距：140像素；
}
#页脚{
边缘底部：10px；
填充：10px；
边框顶部：1px实心#9090；
}

第一节



第二节

项目2





第三节







这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容

这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容



这是/应该是站点的页脚


但它太高，太多的页面右侧，因为内容不足以使其进入菜单下
只需添加
清除：左到页脚


*{
边界：0；
保证金：0；
填充：0；
}
#菜单框{
左边距：5px；
边缘顶部：5px；
背景色：#E0；
浮动：左；
溢出：自动；
宽度：120px；
}
#菜单框。菜单类别{
字体大小：粗体；
左侧填充：10px；
边框底部：1px实心#000000；
}
#菜单框。菜单项{
左侧填充：20px；
文字装饰：无；
}
#菜单框。菜单项a{
文字装饰：无；
}
#菜单框。菜单项a：悬停{
文字装饰：下划线；
}
#菜单框。已选择{
字体大小：粗体；
颜色：#000000；
}
#内容
{
边缘底部：15px；
左边距：140像素；
}
#页脚{
清除：左；
边缘底部：10px；
填充：10px；
边框顶部：1px实心#9090；
}

第一节



第二节

项目2





第三节







这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容

这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容。这里有一些内容

#footer {
    margin-bottom: 10px;
    padding: 10px;
    border-top: 1px solid #909090;
  clear:both;
}