I've searched through this forum for existing help with customising a horizontal menu to make it stretch to full page width. Taking pointers from the posts I've found I've tried adding the following CSS, which hasn't made any difference to the menu width.


BODY DIV.ux-menu-container UL.ux-menu-horizontal ux-menu-link-first ux-menu-item-parent-pos0
{
display: -moz-inline-stack;
display: inline-block;
zoom:1;
*display: inline;
}

#ariext84_container .ux-menu-container .ux-menu LI.ux-menu-item-main
{
width: 100%;
}

The site itself is here
www.cakepopcorner.co.uk/

I'd be very grateful for some assistance in getting the menu width changed to take up the full page width. That is, from where it is at present at the left, ending beneath the white logo image block at the top of the page.


With much appreciation in advance,
Jonathan

Hello,

Try to use the next CSS rules:



Regards,
ARI Soft

Hi. I appreciate your help however this hasn't changed the menu in any way.

What am I doing wrong?

Where do you add provided code?

Regards,
ARI Soft

Got it.

Your question prompted me to think about the CSS file used. I had put your code into template.css but on closer examination I see that file's not imported in the page (?). Instead I moved the code into beez5.css, refreshed the page and all's good.

Thanks again! The quality of support from you guys is outstanding.

- Jonathan

admin wrote:
Hello,

Try to use the next CSS rules:

Code:

#ariext84 LI.ux-menu-item-level-0 {  width: 113px !important; } UL#ariext84 LI.ux-menu-item541, UL#ariext84 LI.ux-menu-item547 {  width: 129px !important; }

Regards,
ARI Soft

I have same problem, i am using joomla 1.7 with beez_20 template. I have tried to insert your code to template.css (beez_20) and also in "CSS Styles" ARI's config but nothing change. Can you help me to resolve it?
Thanks!