Solved

what im doing wrong with this css menu????

Posted on 2012-03-26
4
305 Views
Last Modified: 2012-03-26
ok i have this example: http://www.grupossc.com/test2012/test2012.html

i use main.css to build the menu on the example

I gonna try to explain what is happend

The main menu of the example is the class Firstdaddy

As you can see when you move the mouse over any option with submenu and after that you move the mouse over the submenu, the font of the option in the main menu loss its color.

I woul like to know how to solve that issue.
menu.css
0
Comment
Question by:altariamx2003
4 Comments
 
LVL 12

Expert Comment

by:HugoHiasl
ID: 37764801
Why it happens is obvious.

You are using :hover for styling the main menu option when the mouse is over. But when the mouse is moved to the submenu it is not longer hovered.

You need to change the script that it adds another class to the main-menu option when the submenu of an option is shown. And it should remove it when the submenu is closed.
0
 
LVL 1

Expert Comment

by:miguelangelcampos
ID: 37764827
Looks like you set font color to White in firstDaddy:hover, but when the element loses focus, it returns to its original colour, but background stays with the gray image.

If you want to avoid this, just comment this on #nav LI:hover :
#nav LI:hover {
/*    background-image: url("http://www.grupossc.com/imagenes/fetapa2.jpg"); */
...
}

Open in new window

This way, background in the main menu will return to original. ¿Is that what you are looking for?
0
 
LVL 22

Accepted Solution

by:
Kim Walker earned 500 total points
ID: 37766805
You have two different hover styles working. One when you hover over the link tag on line 104:
#nav .firstDaddy:hover {...}

Open in new window

and another when you hover over the list item tag on line 92:
#nav LI.hover {...}

Open in new window

This way, when you are no longer hovering over the link tag, the color changes back. I would move the first hover pseudo selector to the list item tag by changing line 104 to:
#nav LI:hover .firstDaddy {...}

Open in new window

This way, as long as you hover over the list item, the child link tag would still remain white.
0
 

Author Closing Comment

by:altariamx2003
ID: 37767381
Thanks brother it was really easy!!!

xmediaman RULES!!!!

hehe
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now