无法正确放置 <div>答案

【问题标题】：Unable to place <div> properly无法正确放置 <div>
【发布时间】：2013-07-05 01:31:39
【问题描述】：

我正在尝试创建这样的部门：

Layout http://img593.imageshack.us/img593/5742/nf5l.png

前三个效果很好，它只是造成问题的页脚之一。

#banner
    {
    background: url(image.gif) repeat-x;
    display:block;
    width:100%;
    height:340px;
    }
.container
    {
    width:960px;
    margin: 0 auto;
    height:960px;
    clear:both;
    background-color:#000;
    }

.left-container 
    {
    width:55.72916%;
    float:left;
    }
.right-container    
    {
    text-align:center;
    width:44%;
    float:right;
    padding-top:25px;
    }

banner 指的是黑色的第一个 div..

现在我应该如何设置页脚 div 的样式，因为当我添加一些信息时，它会出现在横幅 div 的正下方并与左右容器重叠。

还有……

每当我使用<p> 标签并指定一些字体大小时，为什么它会自动将margin-top 和bottom 设为等于font-size.. 它是它的属性吗？

【问题讨论】：

请同时发布您的 HTML 标记。
你在页脚 div 上试过clear:both 吗？？
最后一个问题的答案是肯定的：段落的上下边距为1em，与字体大小相同。不过，您可以轻松地将其更改为像素。

标签： css html

【解决方案1】：

您的问题不完整，但您的页脚元素似乎需要clear:both。

【讨论】：

【解决方案2】：

首先这里的问题不清楚，

避免overlapping with left and right container.（我猜绿色框是指这些）

如果你想让页脚矩形看起来像页眉（我猜是黑框）。你可能需要在绿色矩形中使用 overflow:hidden; 或在页脚 div 上使用 clear:both;

避免it's appearing just below banner div（我猜banner就是黑盒子）

在页脚中使用margin-top:50px;（例如）与页眉保持距离

【讨论】：