Google Answers Logo
View Question
 
Q: CSS Cell Background Colour Change on Hover ( Answered 4 out of 5 stars,   0 Comments )
Question  
Subject: CSS Cell Background Colour Change on Hover
Category: Computers > Programming
Asked by: stephencraggs-ga
List Price: $2.00
Posted: 20 Jan 2006 04:26 PST
Expires: 19 Feb 2006 04:26 PST
Question ID: 435748
Why when I'm trying to use CSS to change the backgroudn colour of a
cell when the cuseor hovers, does only my text backgroudn change?

The page:

http://keepsafe-shop.co.uk/pets/

My CSS:

#side_nav_bg  a {
	background-color: #73BE1E;
	font-family: Verdana;
	font-size: 8pt;
	color: #000000;
	text-decoration: none;
}

#side_nav_bg a:hover
{
	background-color: #FFD600;
}

My HTML:

	<tr>
		<td id="side_nav_bg" height="35" width="145" align="left">
		<div align="center">
			<table border="0" width="90%" cellspacing="0" cellpadding="0" id="table7">
				<tr>
					<td>
					<p align="left">
					<a href="features.php">FEATURES AND 
					BENEFITS</a></td>
				</tr>
			</table>
		</div>
		</td>
	</tr>

Request for Question Clarification by answerfinder-ga on 20 Jan 2006 04:50 PST
Dear stephencraggs-ga,

You need to state the colour of the text - in this case I have made it
red. Is this what you are seeking?

#side_nav_bg a:hover { 
			background-color: #FFD600; 
			color: #ff0000;
                     }
answerfinder-ga

Clarification of Question by stephencraggs-ga on 20 Jan 2006 05:57 PST
I've added that (thank you) but it doesn't make the whole cell
background colour change. What I'm after is what they have on the left
hand navigaiton here:

http://www.keepsafe-pets.co.uk
Answer  
Subject: Re: CSS Cell Background Colour Change on Hover
Answered By: answerfinder-ga on 20 Jan 2006 07:54 PST
Rated:4 out of 5 stars
 
Dear stephencraggs-ga,

Overall I?m afraid your coding is seriously confused, but this is how
you can get over this immediate problem.


#side_nav_bg  a {
	background-color: #73BE1E;
	font-family: Verdana;
	font-size: 8pt;
	color: #000000;
	text-decoration: none;
	display: block;
	padding: 7px 5px 5px 5px;
	width: 140px;
	}

#side_nav_bg a:hover {
	background-color: #FFD600;
	color: #ff0000;
	}

The site you referred me to correctly uses <ul> and <li>tags for
links. Have a look at their coding - right click> View Source.

Use this site to find out more.
http://htmldog.com/


I hope this answers your question. If it does not, or the answer is
unclear, then please ask for clarification of this research before
rating the answer. I shall respond to the clarification request as
soon as I receive it.
Thank you
answerfinder
stephencraggs-ga rated this answer:4 out of 5 stars

Comments  
There are no comments at this time.

Important Disclaimer: Answers and comments provided on Google Answers are general information, and are not intended to substitute for informed professional medical, psychiatric, psychological, tax, legal, investment, accounting, or other professional advice. Google does not endorse, and expressly disclaims liability for any product, manufacturer, distributor, service or service provider mentioned or any opinion expressed in answers or comments. Please read carefully the Google Answers Terms of Service.

If you feel that you have found inappropriate content, please let us know by emailing us at answers-support@google.com with the question ID listed above. Thank you.
Search Google Answers for
Google Answers  


Google Home - Answers FAQ - Terms of Service - Privacy Policy