这是div+css布局中经常会碰到的基础问题,个人觉得采用背景图填充的方法,还是比较简单和切实可行的。最终效果。
CSS源代码:以下是引用片段:
body{
background:#EDEDED;
font-size:70%;
font-family:Arial,Helvetica,sans-serif;
line-height:130%;
color:#666666;
margin:0;
padding:0;
text-align:center;
}
#layout{
width:760px;/*--forie5.x--*/
width:740px;/*--other--*/
margin:10pxauto;
border:solid10px#999999;
border-bottom:solid9px#999999;
/*--底部要加个1px的DIV来清除浮动,所以把
底边框设为9px--*/
background:url(bg.gif)#FFFFFFrepeat-yleft;
/*--背景填充,解决左右栏高度不一致--*/
text-align:left;
}
#sidel{
float:left;
width:190px;
}
#sider{
float:right;
width:540px;
}
pre{
padding:10px;
margin:0;
}
.clear{
background:#999999;
clear:both;
height:1px;
overflow:hidden;