3列布局 auto问题

[Brokenfango]

大家好 问个问题如下：

比如我有个页面：
<div style="margin-left:auto;margin-right:auto;width:900px;height:auto;">
<div style="float:left;width:300px;background-color:red;height:auto;">
ccccc<br/><br/><br/><br/><br/><br/><br/><br/>
</div>

<div style="float:left;width:300px;background-color:blue;height:auto;">
bbbb<br/><br/><br/>
</div>

<div style="float:left;width:300px;background-color:green;height:auto;">
aaaa<br/><br/><br/>
</div>
</div>

<div id="footer" style="height:100px;background-color:pink;">

</div>

我想实现的效果是中间3列布局 footer 显示在页面底下 可是以上代码footer显示在页面顶部 感到不解 请大侠指教!

[hongmei85]

<div style="margin-left:auto;margin-right:auto;width:900px;height:auto;">
<div style="float:left;width:300px;background-color:red;height:auto;">
ccccc<br/><br/><br/><br/><br/><br/><br/><br/>
</div>

<div style="float:left;width:300px;background-color:blue;height:auto;">
bbbb<br/><br/><br/>
</div>

<div style="float:left;width:300px;background-color:green;height:auto;">
aaaa<br/><br/><br/>
</div>
</div>
<div style="clear:both;"></div>

<div id="footer" style="height:100px;background-color:pink;">

</div>

[Acesidonu]

footer清除一下浮动就行了。

[dalmeeme]

需要在footer层前面清除浮动：
......
<div style="clear:both"></div>
<div id="footer" style="height:100px;background-color:pink;">

[Brokenfango]

没错 谢谢各位！

[AsWater]

别谢谢了,楼主结贴散分

[仲兴轩]

做程序的, 在页面上处理确实都有小问题呀, 呵呵

[healer_kx]

<div style="clear:both"></div>

用这个清楚 float:left or right.