PDA

View Full Version : CSS problem?



noobsheep
24 Mar 2009, 04:06 AM
Hi guys, i need some help here.
I realize that my sub menu background is white in color when mouse over.
I want it transparent.
Tired to edit the CSS quite a few times. but it isnt working.

Im using VB web developer. Used a template online and replace the menu area with the program's menu at web developer.

Hope someone can help me.
Thanks in advance.
Appreicate any help given.

Take care.











CSS i used:


/* Menu */

#menu {
float: left;
width: 540px;
height: 51px;

}

#menu ul {
margin: 0;
padding: 50px 0 0 10px;
list-style: none;
line-height: normal;
}

#menu li {
display: block;
float: left;
}


#menu a {
display: block;
float: left;
margin-right: 17px;
padding: 5px 12px;
text-decoration: none;
font: 14px Georgia, "Times New Roman", Times, serif;
color: #FFFFFF;

}

#menu a:hover
{
text-decoration: underline;
background: #000;

}

#menu .current_page_item a {
color: #FFFFFF;
}

Wickham
24 Mar 2009, 05:37 AM
This code
#menu a:hover
{
text-decoration: underline;
background: #000;
}
means that your background-color is black on hover, not white. The font color is white from #menu a

Change to this:-
#menu a:hover
{
text-decoration: underline;
background: transparent;/*#000;*/
}
and hover should be transparent.

If you put the black background on the #menu a style like this:-

#menu a { background: #000;
display: block;
float: left;
margin-right: 17px;
padding: 5px 12px;
text-decoration: none;
font: 14px Georgia, "Times New Roman", Times, serif;
color: #FFFFFF;
}

you will have a black background with white font normally, then transparent with white font on hover.

Your #menu style is height: 51px; but your #menu ul style has padding: 50px 0 0 10px; which has top padding 50px and puts the link below the menu div, so edit 50px to 0 if you want it to be inside.