Hi,
I've looked through the forum but I still can't work this out.
On the same page I need 2 horz menu but with different styling such as colour, otherwise they are the same. Can't quite work it out, could somene please help me here, thanks.

Hello,

You can create as many module instances as you want. You can read about it here. Each module instance has different settings, color, background and others can be configured in module settings.

Regards,
ARI Soft

Thanks for the reply.
Do I just enter the CSS code that is different in the box provided, do I need to use the module suffix ?
Cheers

What CSS code do you want to use?

Regards,
ARI Soft

Both menus are essentially the same but on the second menu the vertical image between menu tabs is a different colour, so it needs to have it's own image, see code;
.ux-menu a{
display:block;
position:relative;
text-decoration:none;
color:#FFF;
background-image: url(../../../../../templates/atomic/images/nav-vert-border.png);
background-repeat: no-repeat;
background-position: right center;
font-size:12px;
line-height:12px;
padding:10px 14px;


}

You can use #{$id} predefined variable in "CSS Styles" parameter. It will be replaced with ID of menu root element. In your case you can use the next code in "CSS Styles" parameter:

#{$id}_container .ux-menu a{
display:block;
position:relative;
text-decoration:none;
color:#FFF;
background-image: url(../../../../../templates/atomic/images/nav-vert-border.png);
background-repeat: no-repeat;
background-position: right center;
font-size:12px;
line-height:12px;
padding:10px 14px;
}

Regards,
ARI Soft