Menu Positions

[andperry]

Could someone please tell me whether DHTML menus are fixed to absolute positions on the page or can they be positioned in relation to a containing HTML division or table?

I have a fixed width web site and would like to be able to float it in the centre of the page, but realise that this would not be possible if the DHTML menus are tied to absolute positions.

Thanks,

Andrew.

[andperry]

Hi,

I've actually managed to answer my own question, so don't anyone bother replying!

On the style for the main DIV of the web page, set position=absolute, left=50% and left-margin=-[50% of division width] (note the negative value for the left margin).

On the menu style set screenposition="center".

Works a treat in both IE and Firefox!!

Andrew.

[Ruth]

Hi,

Thanks for the info. Also, for your info and others who might search for this, you can position the menu absolutely using top= and left=, or you can use screenpostion= plus a top= position, or there is a property called minleft, which you can use with screenposition=center to keep the menu from moving any more than x px left when the browser window is resized. Those are all absolute positions. You can also set the menu to relative positions using the position="relative"; property and the directions for placing the menu relatively in a div or table. This topic has links to explanations, demo and the sample for relatively positioning a menu viewtopic.php?f=10&t=8777

Ruth

[andperry]

Hi Ruth,

Thanks for you reply and the link to the information.

I've actually got two menus - a horizontal one which I have now positioned using screenposition="center" and a vertical one which is in a table cell with position="relative". Everything seems to be fine about from one minor quirk, namely that the arrow images in the vertical menu are now positioned at the top of each cell rather than in the middle (affects both IE and Firefox). If you want to see the problem for yourself, the URL of the page is:-

http://www.longcroftchristianfellowship ... p3/public/

It's only a minor annoyance but I'd like to fix it if at all possible.

Thanks,

Andrew.

[Ruth]

Hi,

It's a css issue. This section

Code: Select all

#main {
	width: 100%;
	clear: both;
}
#main td {
	vertical-align: top;
}
#navbar {
	width: 110px;
	padding-top: 20px;
}

The #main td is affecting the menu program. So make the #main td into a class, like below

Code: Select all

#main {
	width: 100%;
	clear: both;
}
.menutd{
	vertical-align: top;
}
#navbar {
	width: 110px;
	padding-top: 20px;
}

Then on your page, add class="menutd" to the table td area.

Code: Select all

<TD id=navbar class='menutd'>

Hope that helps.

Ruth