In practical applications, sometimes the left column needs to be fixed with a fixed width, and the right column automatically adapts to the browser window size. It is simple and feasible to implement such a layout in CSS, you only need to set the width of the left column. In the above example, the left and right columns adopt a percentage to achieve width self-adaptation, and we only need to set the width of the left column to a fixed value, no width value is set in the right column, and the right column is not floating, Code As follows:
Copy code The Code is as follows: # Left {
Background-color: # e8f5fe;
Border: 1px solid # a9c9e2;
Float: left;
Height: 300px;
Width: 200px;
}
# Right {
Background-color: # f2fddb;
Border: 1px solid # a5cf3d;
Height: 300px;
}
In this way, the Left bar will display a 100% width, and the right bar will be adaptive according to the browser window size.Xmlns = "http://www.w3.org/1999/xhtml">
Left column -- fixed (aa25.cn) right column -- width adaptive (aa25.cn)