Home News Contact Us Forum About Us Demos Products F.A.Q.
Shopping Cart
You currently have 0 items in your cart.


Recent Events
  • 05/09/2017 BIG Autumn SALE

    Use AUTUMN17 coupon code to buy our WordPress or Joomla! extensions with 25% discount. Hurry up! The offer is valid till 11 September.

  • 14/04/2017 Happy Easter

    Wish a Happy Easter and give 30% discount for all our WordPress and Joomla! extensions. Use EASTER17 coupon code. The offer is valid till 17 April.


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




Follow us on twitter



Welcome, Guest
Please Login or Register.    Lost Password?

Setting Individual Width for Each Menu Item/LI
(1 viewing) (1) Guest
Go to bottomPage: 12
TOPIC: Setting Individual Width for Each Menu Item/LI
#5819
Setting Individual Width for Each Menu Item/LI 7 Years, 2 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.
The administrator has disabled public write access.
 
#5820
Re: Setting Individual Width for Each Menu Item/LI 7 Years, 2 Months ago Karma: 0
Also, where can I adjust the line-height of the menu bar to fill the menu container?
The administrator has disabled public write access.
 
#5824
Re: Setting Individual Width for Each Menu Item/LI 7 Years, 2 Months ago Karma: 666
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
The administrator has disabled public write access.
 
#5846
Re: Setting Individual Width for Each Menu Item/LI 7 Years, 2 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?
The administrator has disabled public write access.
 
#5849
Re: Setting Individual Width for Each Menu Item/LI 7 Years, 2 Months ago Karma: 666
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
The administrator has disabled public write access.
 
#5854
Re: Setting Individual Width for Each Menu Item/LI 7 Years, 2 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!
The administrator has disabled public write access.
 
Go to topPage: 12