Menu Vertical Alignment in a table

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:13

Menu Vertical Alignment in a table

Poster: blaine
Dated: Thursday August 26 2004 - 15:43:21 BST

I have a menu that is in a table and I can't get the menu to align at the top and have tried a number of things.

The position issue appears if I have a menuitem that wraps. This forces the other menuitems to display center. Interesting, the menuitems that are submenu's align top but not the standard menuitems.

Can I not make them all align top ?

My site is: http://www.langfamily.ca/gltest/public_html/

- setting the row for the menu to be valign=top
- adding a <span style="vertical-align:top;"> around the menu within the table cell.
- Adding a valign=top to the menuitem
- adding valign=top in the style

I've scanned the support forums and also added the position=relative but that had no effect.

None of these are working correctly.

I have the table border on to make it easier to see

Code:

with(menuStyle1=new mm_style()){
onbgcolor="#F2F1F1";
oncolor="#000000";
offbgcolor="#E6E6E6";
offcolor="#000000";
bordercolor="#000000";
borderstyle="solid";
borderwidth=1;
separatorcolor="#000000";
separatorsize="1";
position="relative";
padding=2;
fontsize="11px";
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="black";
pagebgcolor="#d5d5d5";
headercolor="#000000";
headerbgcolor="#ffffff";
subimagepadding="2 20 2 2";
outfilter="randomdissolve(duration=0.2)";
subimage="<?php echo $_CONF['layout_url']; ?>/glmenu/images/arrow.gif";
orientation = "vertical";
itemwidth="160";
menuwidth="160";
}

Poster: Ruth
Dated: Thursday August 26 2004 - 23:56:12 BST

I think placing the menu inside the span is not a good choice. Have you tried putting non breaking line spaces into the items with multiple words so they won't wrap? If you do want them to wrap, and the problem is where the words Health and Environment end up being lower than the other itmes, I believe it's because they don't call a submenu so don't have a subimage. You could put an html image tag next to the text and use a transparent image the same size as the subimage i.e.

Code:

aI("text=Environment<img src=http://whatever url/clear.gif border=0>; and so on with whatever else is in the aI string

that way the items would match as to having an image and should then end up in the same position.

Ruth

Poster: blaine
Dated: Friday August 27 2004 - 13:05:00 BST

Hi Ruth,

I was thinking that was a clever idea of adding that extra image but it does not have any effect. I would normally use the non-blocking space for those 2 menu items so they would not wrap but the situation will occur and is needed since the site is fixed at 800px.

I actually found that none of the menuitems in the horizontal were responding to valign. It was just coincidence that the ones with the submenu were aligning at the top.

It's fixed now and responding to valign to top or bottom

The fix was to use v5.44 - I was a couple weeks out of date and I saw in the changes notices there were some fixes for alignment.

Thanks again for your assistance - your a great resource for the community. What ever they pay you .. it's not enough

Poster: Ruth
Dated: Friday August 27 2004 - 16:58:13 BST

Thanks so much. Your thanks are our pay. We are volunteers. We love this menu and enjoy helping. I personally like seeing the innovative designs so many users create.

Ruth

Industrial Strength JavaScript and DHTML Menus

Menu Vertical Alignment in a table