Dreamweaver CS5: The Missing Manual

Adding an AP Div to Your Page

In most cases, you’ll position <div> tags that have a variety of HTML elements—images, paragraphs, headlines, and so on. For example, to place a series of links at the top of a page, you could wrap those links in a div tag and position that div. Dreamweaver gives you a couple of ways to insert an absolutely positioned div:

• Use the Insert Div Tag tool discussed on The Insert Div Tag Tool. You can start out by selecting already existing content on the page, or just click where you wish to add a new absolutely positioned div. Either way, you either need to create an ID style first (with the positioning properties discussed above), and then select that style from the ID menu of the Insert Div Tag window (Figure 9-6); alternatively, you can create the ID style by clicking the New CSS Style button in the Insert Div Tag window (Figure 9-6).

• Choose Insert→Layout Objects→AP Div. This command inserts a <div> tag into the HTML wherever you put the cursor. The HTML looks something like this <div id="apDiv1"></div>, though the ID name will vary (it might be apDiv2, for example, if this is the second div you’ve inserted). In addition, it adds an internal style sheet and an ID style (matching the one used in the HTML) with some basic formatting: width, height, Z-Index, and absolute position setting.

• Use the Draw AP Div tool. Dreamweaver provides a tool to draw a <div> tag directly onto the document window. PDrawing AP Divs shows you how this tool works.

Unless you add ...