ARI Soft - Change width of top level menu items

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

Change width of top level menu items

(1 viewing) (1) Guest

Page: 1

TOPIC: Change width of top level menu items

Forum Tools

#5176

Change width of top level menu items 1 Year, 7 Months ago

Karma: 0

Hi,

Is there any way to change the width of the top level menu items (not the drop downs)?

My site is at sp.michaelkalman.net

My current CSS is :

.yui-skin-sam .yuimenubar .bd
{
line-height: inherit;
}

.top_menu .yui-skin-sam .yuimenubar UL
{
padding: 0;
}

.top_menu .yui-skin-sam .yuimenubar UL LI
{
padding: 0;
margin:0;
}

.top_menu .yui-skin-sam .yuimenubar .yuimenu UL LI
{
float: none;
}

BODY #{$id}.yui-skin-sam .yuimenubar,
BODY #{$id}.yui-skin-sam .yuimenubaritem-selected,
BODY #{$id}.yui-skin-sam UL LI.yuimenuitem-selected,
BODY #{$id}.yui-skin-sam .yuimenu .bd
{
background-color: #011E30;
background-image: none;
border-width:1;
}

BODY #{$id}.yui-skin-sam ul li a.yuimenubaritemlabel,
BODY #{$id}.yui-skin-sam ul li a.yuimenubaritemlabel:link,
BODY #{$id}.yui-skin-sam ul li a.yuimenubaritemlabel:visited,
BODY #{$id}.yui-skin-sam ul li a.yuimenuitemlabel,
BODY #{$id}.yui-skin-sam ul li a.yuimenuitemlabel:link,
BODY #{$id}.yui-skin-sam ul li a.yuimenuitemlabel:visited
{
color: #F0F5F8;
}

BODY #{$id}.yui-skin-sam ul li a.yuimenubaritemlabel:hover,
BODY #{$id}.yui-skin-sam ul li a.yuimenuitemlabel:hover
{
color: #F0F5F8;
background-color: #256F91;
}

.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel-hassubmenu
{
background-image: none;
}

.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel
{
width:50px;
text-align:center;
}

.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritem
{
border-width: 1;
}

top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel:hover,
.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel-selected
{
border-width: 1;
margin-left: 0px;
}

cheers
Michael.

mkalman

The administrator has disabled public write access.

#5179

Re:Change width of top level menu items 1 Year, 7 Months ago Karma: 278

Hello,

You can use the following CSS rule:

Code:



#topmenu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel

{

  width: 149px;

}

Regards,
ARI Soft

admin