problems center menu

cubefree · Post by **cubefree** » Fri Jul 09, 2004 7:40 pm

ok, trying to center menu and I've read several great posts about it, but... something's off.

I want to center my menu within an area I've defined as 770 x 110. The area (770x110) itself will be left-aligned. That should be clear enough. Here's the code. I've tried many variants and can't seem to affect it. I've taken off the CSS to eliminate that.

Test URL: http://www.cubefree.com/clients/star/de ... n/test.php

CODE:

Code: Select all

// banner and logo
with(bannerStyle=new mm_style()){
align="center";
}

with(milonic=new menuname("banner")){
style=bannerStyle;
top=0;
left=0;
menuwidth=770;
menuheight=110;
menualign="center";
alwaysvisible=1;
orientation="vertical";
aI("image="+DOM+"images/color/ADB8E6.gif;imageheight=3;imagewidth=770;");
aI("image="+DOM+"images/logo/banner_ylw.gif;offbgcolor=#FEFED9;itemheight=99;url="+DOM+"index.php;align='center';");
aI("image="+DOM+"images/color/ADB8E6.gif;imageheight=8;imagewidth=770;");
}

Using Version 5.31a - Built: Friday July 2 2004 - 10:43 / IE6 / Win2000

Maz · Post by **Maz** » Fri Jul 09, 2004 7:55 pm

Have you tried screenposition="center";

maz

cubefree · Post by **cubefree** » Fri Jul 09, 2004 8:14 pm

Yes, but I don't want to center the menu on the screen.

I want to center the whole collection of elements within the area defined by the menu.

Post by **Ruth** » Fri Jul 09, 2004 8:44 pm

I downloaded your page and looked at the menu. You have it defined at 770x110. To test it I put a red border around to see where the menu is, well it spans that width and height. So, do you mean you want the image of the stars, people and text centered? If that's what you want is to align the images to the center, then in this code insert

Code: Select all

// banner and logo 
with(bannerStyle=new mm_style()){ 
align="center"; 
imagealign="center";
}

I tested it in Netscape 7 and IE 5.5

Ruth

cubefree · Post by **cubefree** » Fri Jul 09, 2004 10:45 pm

Thanks, I tried that. And it worked for the top part of the banner.

But the real challenge is the top horiz menu, please see http://www.cubefree.com/clients/star/dev/spktrn/

I applied your code comments that style,

Code: Select all

// banner and logo 
with(bannerStyle=new mm_style()){ 
align="center"; 
imagealign="center"; 
}

http://www.cubefree.com/clients/star/de ... op_data.js, but don't seem to be getting the whole collection of menu elements centered together in the blue strip. They are center separately and distributed over the width 770.

I could of course simply add spacers left and right of the cluster, but thought the menu already covered that option in an property. Is there a better way?

kevin3442 · Post by **kevin3442** » Sat Jul 10, 2004 12:38 am

Hi cubefree,

Do you want the red border, or is that just for testing as Ruth had done? If you don't want it, remove

Code: Select all

bordercolor="#F51121";
borderstyle="solid";
borderwidth=1;

from topStyle, or else the border will add to the overall width.

Then, try removing align="center;" from topStyle (it only affects text as far as I know, so it's not doing anything for you).

Leave imagealign="center;" in topStyle to center the item images, just as you have it.

Add menualign="center"; to your "topMenu" properties. menualign is meant to align the entire collection of images within the overall menu container.

Does that help?

Kevin

cubefree · Post by **cubefree** » Sat Jul 10, 2004 7:05 am

Hmmm.... none seemed to work Kevin, but

Code: Select all

aI("image="+DOM+"images/spacer.gif;imagewidth=100;imageheight=1");

does...

Can't spend too much more time on it. But thank you both for trying.

The descriptions for the properties are a little unclear in the properties lists. Not sure if this version had altered that, but several combos still didn't do it.

kevin3442 · Post by **kevin3442** » Sat Jul 10, 2004 8:00 am

Odd... it worked for me using your example page's code and your menu code, in IE6/win2k. Also worked in NS7.1. What browser are you seeing the problem in? Then again, maybe I don't understand the problem???

If you found a solution, then more's the good.

Cheers,

Kevin

Post by **Ruth** » Sat Jul 10, 2004 8:15 am

If you don't want to use an image, you can just code

Code: Select all

aI("text=&nbsp;;itemwidth=whateversize;type=header");

I only suggest it because I noticed you had headers commented out. That way there's no pointer showing if someone mouses over that blank area. Put one at the beginning and one at the end. I've got IE5.5 and I couldn't get the menualign to work. Actually, I think you have a little more control this way as to exact positioning being able to widen or lessen either one of the aI fill strings.

Ruth

cubefree · Post by **cubefree** » Sun Jul 11, 2004 4:52 am

I'm using IE6, win2k.

Ruth, I'm a bit leary of putting " " in the middle of an aI() item.

Popups have failed due to the extra semi-colon in the middle. So I'll stay away from that one lest it fail in some browsers.

Thanks again for your posts!

Post by **Ruth** » Sun Jul 11, 2004 1:49 pm

You might still want to use the type=header to keep the pointer from acting as if that's a clickable item. If you are using the header with a specified color, you can put a header code into the item itself with a different color specified i.e. headerbgcolor=bgcolor of the menu here.

I didn't know about that problem with the non breaking line space. Thanks for the info, I'll use an image now instead.

Ruth