CSS: left-side layout. The right side is adaptive to the left-side width.

First look:

Figure 1: left-side layout, fixed width on the left side, and adaptive residual width on the right side

Figure 2: The left side is 0 Px in width and the right side is adaptive to 100%

The following is the HTML and CSS layout code of the example.

Reference content is as follows: <Div id = "box"> <Div class = "text"> <H2> [enterprise news] <a href = "#"> introduction to the forest peninsula project </a> <P> introduce the advanced concepts of internationally renowned scientific parks, emphasize the harmonious unity of human and nature, and highlight the ecological development, humanistic environment, and industrial characteristics. Production, learning, and research are closely integrated with education, scientific research, and incubator to build a multi-network environment space, emphasizing the harmonious unity of man and nature, and highlighting the ecological development </p> <P class = "foot"> <a href = "#"> View full text </a> Release Date: </p> </Div> <Div class = "clear"> </div> </Div>

The following is the css code:

Reference content is as follows: # Box { Background: url (../images/line.gif) left bottom no-repeat; Padding: 19px 3px 21px 5px; Overflow: hidden; } # Box. summarypic { Float: left; Margin: 0 35px 0 0; Width: 142px; Height: pixel PX; }   # Box. text { Text-align: left; }   # Box h2 { Font: 14px/16px ""; Color: # dbbe79; Margin-bottom: 9px; }   H2 a: link, h2 a: visited { Font: 14px/16px ""; Color: # dbbe79; Font-weight: bold; Text-decoration: none; }   H2 a: hover, h2 a: active { Text-decoration: underline; }   # Box p { Margin: 0px; Padding: 0px; Font: 12px/19px ""; Color: # c8c8c8; }   # Box p. foot { Font: 12px/21px ""; Color: # e2c374; Margin-top: 15px; Text-align: right; }   P. foot a: link, p. foot a: visited { Font: 12px/21px ""; Color: # e2c374; Text-decoration: underline; Float: left; }   P. foot a: hover, p. foot a: active { Text-decoration: none; }   . Clear { Clear: both; Margin: 0px; Padding: 0px; Font-size: 0px; Height: 21x; Line-height: 0px; }