Complex Layouts

Now the task before you is to begin combining techniques to come out with more advanced layouts. A good example is a fixed, centered design with three columns. If you're thinking you'd mix the positioning technique for centered, fixed designs with floats for the columns, go to the head of the class! Example 13-7 shows how.

Example 13-7. Complex layout with centering, positioning, and floats

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">     <html xmlns="http://www.w3.org/1999/xhtml"><head><title>working with style</title><style type="text/css">#container {position: absolute; left: 50%; margin-left: -300px; width: 600px; margin-top: 10px;}#masthead {width: 600px;}#nav {float: left; width: 150px;}#content {float: left; width: 290px; margin-right: 5px; margin-left: 5px;} ...

Get Spring Into HTML and CSS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.