Chapter 7. Visual Formatting Properties

One of the obstacles Web designers commonly face is getting a page to look the way they want it to without it taking forever to load. While it's true that graphics give you the flexibility to add text and layout exactly where you want them in your design, and tables enable you to position elements in the browser window or assemble graphics in jigsaw fashion, both graphics and tables take more time to render than straight HTML content. These elements can substantially slow the speed at which your page loads.

Using CSS to create Web layouts provides more accuracy than either graphics or tables, and the results are displayed much faster.

You've already learned how to use CSS to control margins and borders in your composition (Chapter 6). With CSS, you can also position elements in the window, either exactly (absolutely) or in relation to other elements (relatively). In addition, CSS also lets you "float" elements next to each other horizontally in the window, so that you can create columns and other robust layout formats.

This chapter introduces you to the different methods you can use to position HTML elements using CSS, including how to stack elements on top of one another and float elements next to each other.