Css经典三列布局

Div代码如下：

 

<div id="three_col">
     <!--右侧，首先-->
     <div class="rcol">
         <div class="cate_small_box">
             <div class="comm_tab_header">
                 <span class="rbox">
                     <span class="macro_tab_on">餐 厅</span>
                    <span class="macro_tab_on">网 友</span>
                    <span class="macro_tab_on">网 友</span>
                    <span class="macro_tab_on">网 友</span>                   </span><em class="default_title">热点讯息</em>                </div>
              <div class="cate_content">
              <div class="padding">
               <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
                <li>热点信息</li>
               </div>
               </div>
             
            </div>
        </div>

    <!--右侧结束-->

    <!--左侧，其次-->
        <div class="lcol">
         <div class="cate_search">
             <div style="padding:100px 20px 5px 20px;">
                 <div class="cate_content">
                        <li>asdfsdf</li>
                        <li>asdfsdf</li>
                        <li>asdfsdf</li>
                        <li>asdfsdf</li>
                        <li>asdfsdf</li>
                        <li>asdfsdf</li>
                    </div>
                </div>
             
            </div>
        </div>

    <!--左侧结束-->

    <!--中间列最后-->
        <div class="ccol">
         <div class="cate_normal_box">
             
            </div>
        </div>

    </div>

    <!--中间列结束-->

Css代码如下：

#main{
 width:1000px;
 margin:0 auto;}
#three_col{
 clear:both;}
#three_col .rcol{
 float:right;
 width:331px;}
#three_col .ccol{
 width:374px;
 margin-left:289px;
 margin-right:337px;}
#three_col .lcol{
 float:left;
 width:283px;}
 
#two_col{
 clear:both;}
#two_col .rcol{
 width:250px;
 float:right;}
#two_col .lcol{
 width:742px;}