Starting with the fixed width of the two columns, when trying the layout of the two columns, the width of the left and right columns can be adaptive. We know from the Adaptive Layout of the column, the adaptive setting is mainly based on the percentage value of the width. Therefore, in the Adaptive Layout of the two columns, the percentage width value is also designed. Continue with the above CSS Code To define the width of the two columns:
Copy code The Code is as follows: # Left {
Background-color: # e8f5fe;
Border: 1px solid # a9c9e2;
Float: left;
Height: 300px;
Width: 20%;
}
# Right {
Background-color: # f2fddb;
Border: 1px solid # a5cf3d;
Float: left;
Height: 300px;
Width: 70%;
}
The width of the left column is set to 20%, and the width of the right column is set to 70%. It looks like a common webpage with navigation on the left and content on the right.Xmlns = "http://www.w3.org/1999/xhtml">
Left column -- (aa25.cn) right column -- two-column width adaptive (aa25.cn)