ARI Soft - CSS Styling questions

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

CSS Styling questions

(1 viewing) (1) Guest

Page: 12

TOPIC: CSS Styling questions

Forum Tools

#4627

CSS Styling questions 1 Year, 8 Months ago

Karma: 0

Hi,

Thanks again for the great support! I have a few questions on how to style the menu:

1) How to remove the default dropdown arrow image?

2) How to specify standard width for each parent item placeholder (currently, item width auto resizes) and center text in placeholder?

3) I've removed the border from the menu (BODY #{$id}.yui-skin-sam .yuimenu .bd {border-width:0;}) but a vertical line between each parent item still remains. How can I remove this?

Screenshot of current layout below.

Appreciate your help!

hinata93

The administrator has disabled public write access.

#4628

Re:CSS Styling questions 1 Year, 8 Months ago	Karma: 0
apologies, resized image attached

hinata93

The administrator has disabled public write access.

#4629

Re:CSS Styling questions 1 Year, 8 Months ago Karma: 276

Use the following CSS rules, please:

1.

Code:



.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel-hassubmenu

{

  background-image: none;

}

Code:



.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel 

{

  width:55px;

  text-align:center;

}

Code:



.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritem 

{

  border-right-width: 0;

}



top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel:hover,

.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel-selected 

{

  border-left-width: 0;

  margin-left: 0px;

}

Regards,
ARI Soft

admin

The administrator has disabled public write access.

#4632

Re:CSS Styling questions 1 Year, 8 Months ago

Karma: 0

Thanks for your response.

1- worked perfectly.

2- fixed width worked perfectly but center align doesn't work

3- still doesn't work. I tried changing border-left-width=0 and border-right-width=0 to border-width=0 in both cases, this gets rid of the vertical lines on hover but not while inactive.

Could there be a conflict in my CSS styling? Here are the current styles in my CSS styles parameter box:

.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: #fff;
background-image: none;
border-width:0;
}

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: #5F798F;
}

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

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

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

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

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

Thanks again!

hinata93

The administrator has disabled public write access.

#4633

Re:CSS Styling questions 1 Year, 8 Months ago	Karma: 276
Send the latest HTML source of this page, please, by email. Regards, ARI Soft

admin

The administrator has disabled public write access.

#4647

Re:CSS Styling questions 1 Year, 8 Months ago Karma: 276

2. Add the following CSS rule:

Code:



.top_menu .yui-skin-sam .yuimenubarnav .yuimenubaritemlabel

{

  padding: 0;

}

3. Unfortunately we don't see this issue on sources which you sent.

Regards,
ARI Soft

admin

The administrator has disabled public write access.

Page: 12

Useful Links