Example
This DIV is named "header" and is styled with a gray border.
This DIV is named "container" and is styled with a red border.
This inner DIV is named "nestedDiv" and is styled with a blue border.
This is an extra paragraph of text placed inside the "container" DIV below the "nestedDiv".
HTML Markup
<div id="header">
<h2>This DIV is named "header" and is styled
with a gray border.</h2>
</div>
<div id="container">
<p>This DIV is named "container" and is styled
with a red border.</p>
<div id="nestedDiv">
<p>This inner DIV is named "nestedDiv" and
is styled with a blue border.</p>
</div>
<p>This is an extra paragraph of text placed
inside the "container" DIV below the "nestedDiv".</p>
</div>
CSS Styling
#header { border: solid 2px gray; }
#container { border: solid 2px red; }
#nestedDiv { border: solid 2px blue; }