Css Tutorial : Adding a Div

You create a division element within the (X)HTML by placing the following in the body:
<div>
<p>This is our content area.</p>
</div>
The result is a hook to which CSS can be applied. In Chapter 2, you learned about using IDs
and classes to add identifiers to a standard (X)HTML element. The same formula is used for
divs by referencing the selector in the opening tag using id="name" or class="name". In this
case, we’ve used an ID named container to define the division:
<div id="container">
<p>This is our content area.</p>
</div>
Let’s apply some simple CSS to the container ID:
/* Container holds all visible page elements */
#container {
padding: 20px;
border: 1px solid #000;
background: #CCC;
}
With this CSS applied to our markup, the container will have a gray background with a
black border, and any elements it contains will be padded 20px from that border, as you can see
in Figure 3-1.