#left {
text-align: right
width: 50%
padding-right: 10%
float: left
}
#right {
width: 50%
text-align: left
padding-left: 10%
}
#footer {
clear: both
}
扩展资料：
CSS 规则集（rule-set）由选择器和声明块组成：选择器指向您需要设置样式的 HTML 元素。声明块包含一条或多条用分号分隔的声明。每条声明都包含一个 CSS 属性名称和一个值，以冒号分隔。多条 CSS 声明用分号分隔，声明块用花括号括起来。
1、首先我不给div定位来看看两个div在浏览器中是如何显示的，具体的代码如下：
如下图，可以看到两个div在没使用定位的情况下显示的位置，我们可以发现div是个块，自动换行了。
2、相对定位：首先给div2使用相对定位，用position:relative来实现的，具体的代码如下：
可以看到如下图，div2的位置离div1的位置偏移了上边四十个像素，左边四十个像素。
3、绝对定位：现在来看看绝对定位，使得div1和div2能重叠，具体的代码如下：
如下图是不是发现两个div块重叠了，具体的效果如下图。
4、绝对定位：现在我来使得div1的绝对定位边60px，左边60px，看看执行的效果是什么样子呢？具体的代码如下：
可以看到如下图的执行效果，是不是得出了绝对定位的定位点是浏览器左上角坐标点为(0,0)这个像素点为起点的。
5、div块加文字P:这里为了说明下个定位相关的知识，我先做如下的模型，具体的代码如下：
如下图可以看到文字在div块中，那么我们该如何使得div中文字总是在div块中呢,这里说的是使用绝对定位的情况下。
6、div和文字：将div块设置成绝对定位，看看文字显示的位置，具体的代码如下：
如下图，是不是发现文字没有在div块中了。
7、div绝对定位下块中的文字：这里我要实现div在绝对定定位下，div以及能在块中，具体的代码如下：
上面相对，下面绝对，具体的显示效果如下图。
我来回答你：把下面的代码复制到记事本中，保存，并保存为.html网页文件，打开就看到了！代码如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0padding:0}
#a{ width:910pxmargin:20px auto}
#l{ width:450pxborder:1px solid #cccfloat:leftheight:210px}
#r{ width:450pxborder:1px solid #cccfloat:rightheight:210px}
.cf{ clear:both}
.f{ clear:bothheight:90pxborder:1px solid #cccmargin-top:6px}
.l{ width:400pxborder:1px solid #cccfloat:leftheight:210pxmargin-top:6px}
.r{ width:500pxborder:1px solid #cccfloat:rightheight:210pxmargin-top:6px}
</style>
</head>
<body>
<div id="a">
<h1>网站简单布局 兼容IE FF</h1>
<div id="l">左框</div>
<div id="r">右框</div><div class="cf"></div>
<div class="f"></div>
<div class="l"></div>
<div class="r"></div>
</div>
</body>
</html>
如果可以，请给我分！
