1. Create a new document with Style Sheet Alignment and import TUTORIAL7.PSD.

2. Create a frameset and set the background colors.

From the Insert menu, select Vertical Frameset Divider.

Position the divider so it is just to the left of the gold panel.

Set the background color for each frame and delete the temporary background layer.

3. Set the frame size options.

With Frame 1 selected, click the Layout tab on the Properties window.

• Assign the following settings:
  Align with Style Sheets
  X-Size Undefined
  

Select Frame 2.

• Assign these settings:
  Align with Style Sheets
  X-Size Absolute

With these settings, the right-hand frame with the HTML buttons will stay a constant size and the left-hand frame will resize to fill the browser window.

4. Set the graphics layout options.

Select the black bar layer in Frame 1.

On the Layout tab in the Properties window, assign the following settings:

• Position
  X Pos Percentage
  Y Pos Pixels
• Size
  X Percentage
  Y Pixels

With these settings the black bar will resize to the full width of Frame 1 as the browser window is resized.

Select the H, T, M and L layers in Frame 2 and assign these settings:

• Position
  X Pos Pixels
  Y Pos Percentage
• Size
  X Pixels
  Y Percentage

With these settings, the buttons in Frame 2 will spread out to fill the height of the frame as the browser is resized.

Note: The interactive warnings window will warn you of incompatibilities with specific browser versions.