11. Layout with Styles

In This Chapter

Considerations When Beginning a Layout

Structuring Your Pages

Styling HTML5 Elements in Older Browsers

Resetting or Normalizing Default Styles

The Box Model

Changing the Background

Setting the Height or Width for an Element

Setting the Margins around an Element

Adding Padding around an Element

Making Elements Float

Controlling Where Elements Float

Setting the Border

Offsetting Elements in the Natural Flow

Positioning Elements Absolutely

Positioning Elements in 3D

Determining How to Treat Overflow

Aligning Elements Vertically

Changing the Cursor

Displaying and Hiding Elements

You can create a wide variety of layouts with CSS. This chapter demonstrates how to build a common layout type: a masthead on top, two columns of content, and a footer on the bottom (on the next page). However, you can apply the CSS properties you’ll learn about to make vastly different layouts.