DIV CSS layout has one row and two columns, the left column has a fixed width, and the right column has an adaptive width; set the minimum width and display scroll bars when the window is small._html/css_WEB-ITnose

DIV+CSS 布局一行两列,左列固定宽度,右列自适应宽度;设置最小宽度,窗口小的时候显示滚动条;Firefox IE测试通过.
辛苦几天的结果啊
平行共三行,中间行分两列,左边固定宽度,右边自适应,并且对行宽度设置了最小值,如果窗口小到最小值以下将出现滚动条,这样一来布局就不会乱了.

下面两句很重要的.百分比情况下窗口人为缩小的时候布局混乱问题就解决了.

.divGlobal,.DivTop,.DivBottom{min-width: 760px;width: expression(document.body.clientWidth  < 760 ? "760px": "100%" )/*最小宽度设置*/;width:100%;}

.DivMainLeft{float:left;}
.DivMainRight{margin-left:210px;}

原来粘贴错了.现在好了.不好意思.


 
 
 
 
 
 

 
 

 
  <script><br>// alert(document.body.clientWidth);<br> //alert(document.body.clientWidth < 760? "760px": "100%" );<br /> </script>

top

 

  

   

    

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    

   

   

    

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    
• 左边固定宽度

    

   

   
  

  

   

     

     
• 右边宽度自适应.

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     

   

   

     

     
• 右边宽度自适应.

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     
• 右边宽度自适应

     

   

                                                                                                                       
                                                                                       class ="li1">Right width adaptive
                                                                                                                       ;The right width is adaptive
 

The right width is adaptive

>

DIV CSS layout with one row and two columns, left The column has a fixed width and the right column has an adaptive width; set the minimum width and display the scroll bar when the window is small; the Firefox IE test passed.

The result of several days of hard work
There are three parallel rows, and the middle row is divided into two columns. The left side has a fixed width, the right side is adaptive, and a minimum value is set for the row width. If the window is smaller than the minimum value, a scroll bar will appear, so that the layout will not be messy.