Please help me on my codes..

[jovypinoy]

Hi guys, This is what I wanted to do.

1. When I hover my mouse on the sidemenu. It will change it background color.

Here is my codes.

#main-sidebar {
	width: 185px;
	float: left;
	padding-right: 10px;
	
	
}
#article-sidebar {
	color: #0b73b7;
	font-size: 14px;
	font-weight: bold;
}
#article-sidebar li {
	padding-bottom: 15px;
}
#article-sidebar li ul {
	padding: 5px 0px 0px 0px;
}
#article-sidebar li ul li {
	padding: 7px 0px 0px 15px;
}
#article-sidebar a:link,
#article-sidebar a:visited,
#article-sidebar a:hover,
#article-sidebar a:active {
	text-decoration: none;
}

This is what it looks like http://www.daniweb.com/forums/attachment.php?attachmentid=23005&stc=1&d=1322016962

But when I try to edit this one.

#article-sidebar a:link,
#article-sidebar a:visited,
#article-sidebar a:hover{
        background-color: black;
}
#article-sidebar a:active {
	text-decoration: none;
}

It looks like this.. http://www.daniweb.com/forums/attachment.php?attachmentid=23006&stc=1&d=1322017134

I really appreciate all the replies.

[kyraa]

i am a beginner.. but from what i know a means anchor, if what you want to hover is not an anchor and the id is article-sidebar then the css should be like this:

#article-sidebar:hover{
       background-color: black
}

hope its help..

[simplypixie]

I presume your problem is that the black background is only applied to the links whereas you want some padding between your link text and the edge of the black background. If this is the case then as you are only applying your black background to the link then what you have is correct, you need to apply the background to the containing element as well, in the case your li.

#article-sidebar li:hover, #article-sidebar li ul li:hover {
	background-color: black;
}

[jovypinoy]

Hi Sorry for the delay.. This was actually solved but from the other site. My only mistake from my original post was I placed hover first before the active.. It should be the active before the hover..

Here is my new codes.

#article-sidebar a,
#article-sidebar a:link,
#article-sidebar a:active {
    text-decoration: none;
}
#article-sidebar a:visited{
background-color: #f5f5f5;
color: #0b73b7;
}

#article-sidebar a:hover{
background-color: black;
color: #fff;
}

Thanks for the reply guys.. Daniweb rocks!