ARI Soft - Setting Individual Width for Each Menu Item/LI

Home

News

Forum

Featured Demos

ARI Smart Content demo

ARI Quiz demo

ARI Sexy Lightbox demo

e-mail: info@ari-soft.com

Shopping Cart

Show Cart

Recent Events

29/12/2011 Merry Christmas and Happy New Year!

Dear visitors, our office will be closed from December 30 to January 2 due to the celebration of the New Year. You can purchase and download our products, but we can not guarantee quick answers to your questions for this period of time. Happy New Year! Your ARI Soft team.

more...
27/09/2011 ARI Smart Content v. 1.8.0

ARI Smart Content v. 1.8.0 is ready. New version is compatible with Joomla! 1.5, 1.6 and 1.7 and it is released under GNU GPL license.

more...

2Checkout.com, Inc. is an authorized retailer of goods and services provided by ARI Soft.

Welcome, Guest
Please Login or Register. Lost Password?

ARI Soft Forum

Joomla components

ARI YUI Menu

Setting Individual Width for Each Menu Item/LI

(1 viewing) (1) Guest

Page: 12

TOPIC: Setting Individual Width for Each Menu Item/LI

Forum Tools

#5819

Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago	Karma: 0
Dear Sir, I would like to set a different width for each individual menu item/LI in order to fill the menu bar - otherwise the space to the right appears empty. Basically I want the width of each top menu item to be larger so I can fill the space of the menu bar but I want each width to be different. Where/how I can make these changes within the CSS? My site is here.

craad

The administrator has disabled public write access.

#5820

Re: Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago	Karma: 0
Also, where can I adjust the line-height of the menu bar to fill the menu container?

craad

The administrator has disabled public write access.

#5824

Re: Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago Karma: 278

Hello,

Download and upgrade the module, please. New version add the following CSS class to menu items: yui-menu-item<menu_item_id>

Where <menu_item_id> is menu item id. Use the following CSS rule that change line height of the container:

Code:



body .module #ariyui52.yui-skin-sam ul li a.yuimenubaritemlabel

{

  line-height: 34px;

}

Regards,
ARI Soft

admin

The administrator has disabled public write access.

#5846

Re: Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago	Karma: 0
Thank you. Could you be more specific about where exactly to add the class yui-menu-item<menu_item_id> to menu items? I will need to add a separate class to each menu item and then specify the width for each individual menu item within CSS. What would the code look like?

craad

The administrator has disabled public write access.

#5849

Re: Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago Karma: 278

The following CSS rule can be used:

Code:



.yuimenubar .yui-menu-item<MENU_ITEM_ID>

{

  width: 90px;

}

Where <MENU_ITEM_ID> is menu item id which can be found in Joomla! menu manager. For example, if you want to set 100px width for 'home' menu item on your site, use the following CSS rule:

Code:



.yuimenubar .yui-menu-item53

{

  width: 100px;

}

Regards,
ARI Soft

admin

The administrator has disabled public write access.

#5854

Re: Setting Individual Width for Each Menu Item/LI 1 Year, 6 Months ago	Karma: 0
Thank you! I also want to say this is a great module and your other software applications are phenomenal as well. Keep up the great work!

craad

The administrator has disabled public write access.

Page: 12

Useful Links