Page 1 of 1

Hover not curretly working

Posted: Thu Dec 10, 2009 10:35 pm
by steel
hai friends

i am working in php for that i created css file for menu selecting purpose in that i created class file for selected,unselected and hover while i running the program selected and unselected working properly but the hover is not working curretly here i give the coding please verify and say your suggestion.

Code: Select all

 
#main_table{width:900px; height:20px;}
.unselected a:visited, .unselected a:link{font-family:"Times New Roman", Times, serif; font-size:14px; color:#333333; vertical-align:middle; text-decoration:none;}
 
.selected, .unselected {background:url(../images/link_bg.jpg) repeat-x; height:30px; font-family:"Times New Roman", Times, serif; font-size:14px; vertical-align:middle; color:#FFFFFF; font-weight:bold; text-decoration:no;}
a:hover{background:url(../images/link_bg.jpg) repeat-x; font-family:"Times New Roman", Times, serif; font-size:14px; vertical-align:middle; color:#FFFFFF; font-weight:bold; text-decoration:no;}
 
 

Re: Hover not curretly working

Posted: Fri Dec 11, 2009 11:52 am
by kaszu
I assume your HTML is something like

Code: Select all

<div class="selected"><a href="...">...</a></div>
<!-- or -->
<div class="unselected"><a href="...">...</a></div>
 
If this is true, then DIV (.selected or .unselected) has all the same style, which will be set to A when hovered, so you won't see any difference.

That's a really bad CSS, I feel dirty by only reading it
1) Why are you repeating same style over and over again!?
2) Instead of "font-family", "font-size" and "font-weight" you can use "font: bold 14px "Times New Roman", Times, serif;"
3) #FFFFFF is the same as #FFF
4) "text-decoration:no;" <- invalid