The most flexible way to position the menu is to use the Lock to image position option found in the Options tab of the MenuMachine inspector.

This is a very simple way to make the menu move in alignment with your dynamic page design. As floating boxes (therefore MenuMachine menus) can't be placed inside other HTML elements such as tables, this is a clever way to make the menu behave as though it had been.

This powerful option allows you to align the top-left of the menu with the top-left of an image that is on the page. This image can be placed inside a table cell, which makes the menu align as if it had been put inside the table cell.

The menu at right has been locked to an image placed in a table cell under the 'In this section' area. It moves as the browser window is resized.

The image can be a transparent gif so you can't see it, or it can be an image you want to see (the image will sit 'behind' the menu as the menu floating box will be in a layer 'above' normal html elements).

If you don't want the menu to overlap any of the page content, just make the 'lock' image the same height and/or width as the menu to create a 'space' for the menu.

In brief, to use Lock to image position, the MenuMachine floating box placeholder ( little yellow box) must be placed as the last object in the page. You must name the image using the Name field in the image inspector before selecting it from the pull-down list in the MenuMachine inspector.

Here's an example to follow in GoLive. Adapt these instructions for your page design:

1) Open a blank page that is saved into a GoLive site.

Note: Some browsers need page margins specified so they can display the position of elements accurately. Set your page margins to fixed pixel values for best results.
2) Drag a MenuMachine object onto the page.

3) Drag an image object onto the page and link it to an image (e.g. the transparent spacer.gif file that has been saved into the GeneratedItems folder in the site). Change the image's size to 100 x 100px.

4) Name the image in the image inspector.

GoLive CS:		GoLive 6:
Go the Basic tab of the inspector and select Name from the pull-down list. Type a name into the Name field. Note: Do not use spaces or non-alphanumeric characters except for underscore (_) and do not use a number as the first character of the name.		Go the More tab of the inspector and type a name into the Name field. Do not check the Is Form box. Note: Do not use spaces or non-alphanumeric characters except for underscore (_) and do not use a number as the first character of the name.

5) Put a table on the page that has a width of 70%. Make the table have a centered alignment (so that the table moves when the browser window is resized). Drag your named image into a cell of the table. Put some text in the other cell to give it some width. Your page should look something like this:

6) Select the menu to invoke the MenuMachine inspector.

7) Go to the Options tab and check the Lock to image position checkbox. Select the named image from the pull-down list.

You will not see the menu change position in the GoLive Layout view. In fact, the position of the menu will be overridden so you may place the menu's floating box anywhere that is convenient for you as you are working.

8) Use the Special > MenuMachine > Fix Object Nesting (MM 1.0–1.6) or Fix Code Location (MM 1.7 and later) command to make sure the menu's code is correctly positioned in the HTML code of the page. Save the page (in the GoLive site).

9) Preview in a browser. Resize the browser window to make the table change position, therefore making the image and also the menu both change position.

Once you have mastered this simple yet flexible technique, you will be able to adapt it to almost any page design. This technique can be used in conjunction with Components. There are special instructions for Components here.