Using CSS for Page Layout Working with Floating and AP - New Perspectives on Adobe Dreamweaver CS5, Comprehensive - page 219

Figure 4-38 The available AP div repositioned in the home page

AP divs have the
same index number

◗

3. Repeat Step 2 to select the TICKETS AP div and change its z-index number to 1 .
◗

4. Save the page.

Aligning AP Divs
You have dragged AP divs around the page to reposition them, using the rulers and
guides to help you place them in the page. In some pages, you might want to align the
elements more precisely so that the page looks neat and professional. You can align AP
divs to the left, right, top, or bottom of another AP div. To align them, you select one
AP div, press and hold the Shift key, and then click any other AP divs you want to align.
The last AP div you select remains stationary and the other AP divs align to it. The Left
Align command aligns the left borders of selected AP divs to the horizontal position of
the left border of the last AP div you select. The Right Align command aligns the right
borders of selected AP divs to the horizontal position of the right border of the last AP div
you select. The Top Align command aligns the top borders of the selected AP divs to the
vertical position of the top border of the last AP div you select. Finally, the Bottom Align
command aligns the bottom borders of the selected AP divs to the vertical position of the
bottom border of the last AP div you select. Clear resize handles surround the AP divs
that move; solid resize handles surround the AP div that remains stationary.
Gage asks you to align the tops of the two AP divs in the home page.

To align AP divs using the Align commands:

◗

1. In the AP Elements panel, select the available AP div, press and hold the Shift
key, click the TICKETS AP div, and then release the Shift key. The two AP divs
are selected. The Property inspector indicates that multiple CSS-P Elements are
selected. The resize handles for the TICKETS AP div are solid and blue, indicating
that this AP div will remain stationary and any other selected AP divs will align
with it.

You can also press the
Shift key as you click AP
divs in the Document
window to select them.

◗

2. On the Application bar, click Modify , point to Arrange , and then click Align Top .
The selected AP divs align their tops at the horizontal position of the top of the
TICKETS AP div.