If you have Invisible Elements turned on (View, Visual Aids, Invisible Elements), and you've checked Anchor Points for Layers in the Edit, Preferences, Invisible Elements list, a layer marker appears in the Document window for each layer. Even if you move the layer box, the layer marker remains where it was originally positioned.
When Invisible Elements are active and layer anchor points selected, the elements on your page can appear in a shifted position in Design view.
Turn
off this option to get a better idea of how your page will look in a browser.
Adding Content to the Layer
You can insert elements into a layer just as you can with your base document. Before placing elements into a layer, you must first activate the layer by clicking
anywhere
inside its border. (Don't click the layer border itself, because that selects the layer for resizing or moving.)
When you activate a layer, the insertion point appears inside the borders of the layer box. Now any inserted object or typed text will go inside the layer (see Figure 9.10).
Figure 9.10. Activating a layer places the insertion point inside it. Any text or objects inserted here are placed within the layer.
Selecting, Moving, Aligning, and Resizing a Layer in Design View
When you insert layers, they are rarely exactly where you want them to be. Fortunately, manipulating layers is easy. You can move, resize, or align layers in Design view, either "by sight" (see Figure 9.11) or via the Property inspector. You can select a layer or multiple layers in the Layers Panel or the Document window.
Figure 9.11. You can resize a layer by clicking its border and dragging one of the resize points around the edge. Move the layer by dragging on the drag box in the upper-left corner.
Selecting a layer
You can select one or more layers in various ways.
Using the Layers Panel to Select a Layer
To use the Layers panel to select a layer, select Window, Layers and select the
name
of the layer.
Selecting a Layer in the Document Window
Click on the layer's border (the cursor turns into a four-headed arrow) and the resize handles appear, indicating that the layer is selected. Watch out: Clicking inside a layer causes the layer's selection handle to appear at the upper left, but does not actually select the layer. Always check the Property inspector to confirm that what you've selected is what you think you've selected.
Using Keyboard Shortcuts to Select a Layer
To use keyboard shortcuts to select a layer, select (Control-Shift-click) or [Command-Shift-click] from inside the layer.
Using the Tag Selector to Select a Layer
Click in a layer, then click the
<div>
tag in the Tag Selector to select a layer.
Selecting Multiple Layers
To select multiple layers with the Layers panel, Shift-click on as many layers as needed. The layers selected will stay highlighted.
Selecting Multiple Layers in the Document Window
To select multiple layers in the Document window, select Shift-click on the borders of two or more layers.
Resizing a Layer
Resizing a Layer with Resize Handles
In Design view, position the cursor over one of the eight resize handles on the sides and corners of the selected layer. A double-arrow cursor indicates the direction in which you can resize. Click and drag a handle to resize the layer.
Resizing a Layer One Pixel at a Time
In Design view, hold down (Control) or [Option] while pressing an arrow key. This method allows only the right and bottom border to move; the left and top borders are fixed.
Using Grid Snapping Increments to Resize a Layer
In Design view, hold down (Shift-Control) or [Shift-Option] while pressing an arrow key.
Resizing a Layer by Setting the Values
In Design view, type in the values in width (W) and height (H) in the Property inspector (Window, Properties).
Resizing Multiple Layers at the Same Time
Various techniques exist to resize multiple layers
simultaneously
.
Resizing Multiple Layers So They Conform to Each Other
In Design View, select Modify, Align, Make Same Width or Modify, Align, Make Same Height. The first selected layers conform to the width or height of the last selected layer. The last layer selected is represented by solid resize handles on the border; the other layers are represented by hollow resize handles.
Resizing Multiple Layers So That the Same Settings Apply
Select two or more layers. In the Property inspector, under Multiple Layers, enter the width and height values. The values are applied to all selected layers.
Aligning Layers
In Design view, select two or more layers. Select Modify, Align, and choose Left, Right, Top, or Bottom. All layers align with the last selected layer (highlighted in black). When aligning layers, child layers that aren't selected may move with a selected parent layer. The last layer selected is represented by solid resize handles on the border; the other layers are represented by hollow resize handles.
