BORDERS FOR WIRE FRAMING

Applying simple borders to your divisions and other key elements is a brilliant way of creating a wire frame.
Wire framing a design with a thin solid or dashed line around your divs can help you understand how one
element relates to another, and also identify problems with alignment and juxtaposition.
You can apply a simple dashed line to all divs, for example, using a base selector for the <div> tag:
/* Place a thin gray border around all divisions */
div {
border: 1px dashed #CCC;
}
This rule would be placed immediately after the body selector in the style sheet, and would ensure all
divs you create inherit a thin gray border, unless you specify otherwise in that element’s rule. To apply this rule
to further base elements, simply group the selectors together:
/* Place a thin gray border around the following elements */
div, h1, h2, h3, h4, ul {
border: 1px dashed #CCC;
}
When you are satisfied that your design is hanging together correctly, just remove the relevant selectors
or the entire rule.