}
这样的制作只是用来说明absolute的作用，如果只能实现上面的效果，可能在实际制作中并不完美，为了让其更完美一些，在这个基础上我们在来看下面这一步。
第六步：设置固定高度
为了让布局更适用一些，可以在div-1元素上设置固定高度，如：
CSS Code复制内容到剪贴板
#div-1 {
position:relative;
height:250px;
}
#div-1a {
position:absolute;
top:0;
rightright:0;
width:200px;
}
#div-1b {
position:absolute;
top:0;
left:0;
width:200px;
}
相比之下好一点，但我们并不知道元素内容高度将会是多少，所以在此设置一个固定高度也是我们实际中的一个死穴，个人不建议这样使用。如果为了需要，我们可以通过别的办法来实现。
第七步：float
前两步，使用绝对定位都并不是很理想，那么我们可以考虑使用float来解决。我们可以在一个元素上使用float，让元素向左或向右，而且还可以使用文本围绕在这个元素的周边（这个作用在文本围绕图片特别有用）。下面来模拟一下：
CSS Code复制内容到剪贴板
#div-1a {
float:left;
width:200px;
}
第八步：多列浮动
上面展示的是一个列浮动，接下来看看多列的变化：
CSS Code复制内容到剪贴板
#div-1a {
float:left;
width:150px;
}
#div-1b {
float:left;
width:150px;
}
浮动与绝对定位来相比，现在解决了其高度自适应的问题，但也存在一个问题，浮动也破坏了元素当初的文档流，使其父元素塌陷了，那么为了解决这个问题，我们有必要对其进行清除浮动。
