Html 如何防止div与三个较小的div重叠

我的问题是，当我在浏览器中加载它时，扩展的div似乎包含三个较小的div。预期的结果是div在三个一之下。我已经试着把

float:left

放在扩展的页面上，但是我的页脚完全重叠了。我已经在论坛上寻找解决方案，但没有找到合适的解决方案

是我找到的那个职位

div#内容包装器{
保证金：0自动；
宽度：1024px；
背景色：#F5；
位置：相对位置；
}
#一,，
#二,，
#三{
宽度：30.75%；
边框样式：实心；
边框宽度：1px；
利润率：25px 10px 0px；
字体大小：14px；
}
#一,，
#两个{
浮动：左；
}
#三{
浮动：左；
明确：无；
}
#扩大{
宽度：97%；
边框样式：实心；
边框宽度：1px；
利润率：25px 10px 0px；
字号：18px；
}
页脚{
保证金：50px 0px 0px；
宽度：100%；
文本对齐：居中；
背景色：#1F；
颜色：#F5；
填充：1px0px；
}

L
L
L
同侧阴唇

L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
页脚

像这样的东西

.clearfix:after{
可见性：隐藏；
显示：块；
字号：0；
内容：“；
明确：两者皆有；
身高：0；
}
.clearfix{显示：内联块；}
/*开始反斜杠攻击\*/
*html.clearfix{height:1%；}
.clearfix{display:block；}
/*关闭注释反斜杠*/
div#内容包装器{
保证金：0自动；
宽度：1024px；
背景色：#F5；
位置：相对位置；
}
#一、二、三{
宽度：30.75%；
边框样式：实心；
边框宽度：1px；
利润率：25px 10px 0px；
字体大小：14px；
}
#一，二{float:left；}
#三{浮点：左；清除：无；}
#扩大{
宽度：97%；
浮动：左；
边框样式：实心；
边框宽度：1px；
利润率：25px 10px 0px；
字号：18px；
}
页脚{
保证金：50px 0px 0px；
宽度：100%；
文本对齐：居中；
浮动：左；
背景色：#1F；
颜色：#F5；
填充：1px0px；
}

L
L
L
同侧阴唇

L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
L
页脚

谢谢，但同样的结果让我添加了

float:left。现在我的问题是，我的页脚是重叠的一切。但我认为这是另一个问题。@AndySchneider我在代码中看不到页脚，如果你在上面加上float和宽度97%，就像你在
div#expanded
中做的那样，它会出现在
div#expanded
下面。我的页脚在我的内容包装器中，不幸的是，将宽度设置为97%并没有帮助。不过谢谢你，你真的帮了我的忙me@AndySchneider如果您想更新您的问题，请尝试帮助我更新了我的问题，如果我在扩展的@Naren Murali下添加了一些内容，则页脚仅重叠