用CSS+DIV实现固定宽度的三列式分栏

来源：百度知道 编辑：UC知道 时间：2024/05/24 10:11:11
总宽度为760，左中右三栏宽度分别为200、460、100，宽度固定，高度不固定，也就是说这三栏随着内容不同都有可能最高，上下再安排顶部菜单和页脚。在IE6、7，Firefox等常见浏览器中浏览不能变形。检验成功后再送高分。谢谢！
另外，如果再加上三栏的高度自适应最高的一栏就更好了。

帮你做了，很简单。把代码复制到记事本，把后缀名改为 ".htm"就可以看了。 为了让你看的更清楚，我把每列加了颜色，（兼容Firefox，IE,等浏览器）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
*{margin-right:auto;margin-left:auto;font-size:12px;}
#layer {height: auto;width: 760px;height:600px;}
#left {float: left;height: auto;width: 200px;height:600px;background-color:#DAF4FE;}
#conter {float: left;height: 600px;width: 460px;background-color:#FDF1C1;}
#right {float: left;height: 600px;width: 100px;}
#right {background-color: #DBFECF;}
body {margin-top: 0px;margin-bottom: 0px;}
</style>
</head>
<body>
<div id="layer">
<div id="left">宽度为200</div>
<div id="conter">宽度为460</div>
<div id="right">宽度为100</div&