How to implement two-column and three-column layout in css2

Preface

I believe everyone knows about flex elastic layout. It is a property in css3, but it has certain compatibility issues. During the interview a few days ago, the author met the interviewer who needed to design a two-column layout. Of course I said the parent element should be flex, but I needed to use basic CSS2 attribute layout, which was silly. . .

Requirements: two-column layout, fixed width on the left and adaptive on the right

html The layout is as follows

 
我是定宽左
 
我是自适应右
 

1. flex layout

##

#father{ display: flex; } #left{ background: red; height: 200px; width: 200px; } #right{ background: green; height: 200px; flex:1; }

Note:

      
  
 
我是左定宽
 
我是中间自适应
 
我是右定宽
 
  

The above is the detailed content of How to implement two-column and three-column layout in css2. For more information, please follow other related articles on the PHP Chinese website!