急急急!!!
<!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/html; charset=gb2312" />
<title>首页</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<style type="text/css">
/*重置*/
*{margin:0px; padding:0px; font-family:"宋体";}
img{border:0px;}
ul li{list-style:none;}
/*body*/
body{ background-image:url(images/diwen2.gif);}
/*中间图片部分*/
.clear{overflow:hidden; float:none; height:0px; clear:both;}
#main{ width:1000px; height:700px; border:1px solid red; margin:0px auto;}
#ul1 li,#ul2 li{display:inline-block; float:left;}
#ul1 li{height:336px;}
#ul1-l1{ width:345px; background-image:url(images/index_01.jpg);}
#ul1-l2{ width:323px; background-image:url(images/index_02.jpg);}
#ul1-l3{ width:332px; background-image:url(images/index_03.jpg);}
/*右边连接部分*/
/**/
#ul2 li{height:334px;}
#ul2-l1{width:345px; background-image:url(images/index_04.jpg);}
#ul2-l2{width:323px; background-image:url(images/index_05.jpg);}
#ul2-l3{width:332px; background-image:url(images/index_06.jpg);}
</style>
</head>
<!--body-->
<body>
<!--中间图片背景-->
<div id="main">
<ul id="ul1">
<li id="ul1-l1"></li>
<li id="ul1-l2"></li>
<li id="ul1-l3">
<!--右边连接部分-->
<ul>
<li>aa</li>
<li>bb</li>
</ul>
</li>
</ul>
<div class="clear"></div>
<ul id="ul2">
<li id="ul2-l1"></li>
<li id="ul2-l2"></li>
<li id="ul2-l3"></li>
</ul>
<div class="clear"></div>
</div>
</body>
</html>
<!--右边连接部分-->
<ul>
<li>aa</li>
<li>bb</li>
</ul>
这部分不想浮动了,可是一清除就会布局乱?
望大哥大姐帮忙解决下