Dreamweaver CS3 Bible

Prev | Current Page 720 | Next

Joseph W. Lowery

"Dreamweaver CS3 Bible"

When you invoke the CSS Layout Background options from the Visual Aids menu, Dreamweaver clears any
background image or color previously defined in the CSS styles and replaces them with a different solid
color for each

tag. The resulting patchwork shows at a glance how the page is structured (see Figure
11-4). This option is also useful when debugging layouts because it clearly shows which

tags??”if
any??”overlap.
FIGURE 11-4
Turn on CSS Layout Backgrounds when first creating your CSS layout or debugging it.
The colors assigned to each of the

backgrounds are random and can??™t be predefined. A
new set of colors is used every time you toggle CSS Layout Backgrounds into view.
CSS Layout Box Model
All CSS block elements are rendered in the browser according to the CSS box model. The box model, established
by the W3C CSS standards body, determines how much room a block element actually takes up on
the page. The amount of space required for a block element, such as a

tag, is a combination of the
declared width, plus the padding, border, and margin settings. For example, say a div tag has the following
style declared:
#myBox {
width:200px;
padding:10px;
TIP TIP
364
Adding Advanced Design Features Part III
border:5px;
margin:10px;
}
Although nominally, the myBox style appears to be 200 pixels wide, CSS specifications indicate that it will
actually take up 250 pixels of space.

Pages:
708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732

An Account of the Reconquest of the Sudan (page 9) Adonais (page 123) An Account of the Proceedings on the Trial of Susan B. Anthony, on the Charge of Illegal Voting (page 19)

The Book place

Joseph W. Lowery

"Dreamweaver CS3 Bible"