Html 三行流体布局中的div重叠定位

我有一个3行流体布局后，媒体查询的css是

html，正文{
身高：100%；
保证金：0；
填充：0；
字体系列：Arial、Helvetica、无衬线字体；
字号：85%；
颜色：#333399；
}
h1{
字号：380%；
字体大小：粗体；
保证金：0；
}
#容器{
宽度：100%；
}
#标题{
宽度：95%；
高度：80px；
浮动：左；
排名：0；
左：0；
}
#indexleft{
显示：无；
}
#indexright{
浮动：左；
顶部：；
宽度：85%；
保证金：0自动；
}
#页脚{
浮动：左；
高度：50px；
左：0；
宽度：100%；
底部：0；
位置：绝对位置；
}
#页脚p{
文本对齐：居中；
}
克利尔科尔先生{
显示：无；
}
.空间{
显示：无；
}
.indexheader{
宽度：95%；
文本对齐：居中；
左：0；
顶部：20px；
边缘底部：10px；
}
#索引容器{
左：20px；
位置：相对位置；
排名：0；
}
#indexcontainer.indextext{
宽度：80%
}
#indexcontainer.formstyle{
宽度：80%；
浮动：左；
边缘顶部：10px；
垂直对齐：中间对齐；
}
输入[type=“submit”]：悬停{
背景色：#652D91；
颜色：#FFFFFF；
光标：指针；
}
.button、.textfields、.select{
背景色：#BAB3D6；
边界：0；
颜色：#333399；
边缘底部：10px；
填充物：5px；
-webkit外观：无；
}
#indexcontainer.textfields{
右边距：10px；
宽度：250px；
}

不知道我是否理解正确，但这应该很接近

请使用表单标签


html，
身体{
身高：100%；
保证金：0；
填充：0；
字体系列：Arial、Helvetica、无衬线字体；
字号：85%；
颜色：#333399；
}
h1{
字号：380%；
字体大小：粗体；
保证金：0；
}
#容器{
宽度：100%；
}
#标题{
宽度：95%；
排名：0；
左：0；
}
#indexleft{
/*显示：无*/
}
#indexright{
浮动：左；
顶部：；
宽度：85%；
保证金：0自动；
}
#页脚{
浮动：左；
高度：50px；
左：0；
宽度：100%；
底部：0；
位置：绝对位置；
}
#页脚p{
文本对齐：居中；
}
克利尔科尔先生{
显示：无；
}
.空间{
显示：无；
}
.indexheader{
宽度：95%；
文本对齐：居中；
左：0；
顶部：20px；
边缘底部：10px；
}
#索引容器{
左：20px；
位置：相对位置；
排名：0；
}
#indexcontainer.indextext{
宽度：80%
}
#indexcontainer.formstyle{
宽度：80%；
浮动：左；
边缘顶部：10px；
垂直对齐：中间对齐；
}
#indexcontainer.formstyle div{
明确：两者皆有；
}
输入[type=“submit”]：悬停{
背景色：#652D91；
颜色：#FFFFFF；
光标：指针；
}
按钮
.textfields，
.选择{
背景色：#BAB3D6；
边界：0；
颜色：#333399；
边缘底部：10px；
填充物：5px；
-webkit外观：无；
}
#indexcontainer.textfields{
右边距：10px；
宽度：250px；
浮动：左；
}
.formstyle标签{
线高：23px；
}
@介质（最大宽度：700px）{
#页脚{
明确：两者皆有；
位置：静态；
浮动：无；
}
}

你能在这里设置一个代码片段吗？它可以避免进入cssdesk，使你的问题更具可读性。至少添加与你的CSSSO相关的HTML，我们不必从URL和答案来回返回-尝试使用代码片段工具：）@GCyrillus editedI不知道你的意思。我写的内容包含在媒体查询@media中（最大宽度：1000px）{以上代码}可能这应该是您的代码段的一部分。结果不更改查看您的代码段如果窗口非常小，页眉和页脚重叠更新我的代码段。