Re: [css-d] Color change on row hover

[Mike Stickel]

Hmm, right you are, does not work in FF, can someone maybe give me  
a example

of how to do this, start to finish, where you have a list of links,
vertical, and hovering anywhere in the row will highlight that row
background, and also toggle the link color of the text, even if it  
is not

100% as wide as the row.


Scott,

Richard had the right method for you to use. IE doesn't read the  
":hover" psuedo class on anything other than links. If you remove the  
tr:hover and instead create the a:link, a:visited, and a:hover states  
for the navigation you will achieve the desired result.


Using the display: block property will, as Richard explained, fill  
the links "hot area" to cover the full width of the td (and thusly  
the tr). I'm not sure if you've changed it yet but taking a look at  
the source shows me that you're close. The one thing I noticed is  
that you're missing the text color declaration in the #navcontainer  
a:hover style. Try adding "color: #333" or whatever color you'd like  
the text to be in there.


HTH,

Mike Stickel
Screenflicker Developments
www.screenflicker.com

p: 403-923-7667
e: [EMAIL PROTECTED]


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Color change on row hover

[Scott Haneda]

on 7/11/05 6:32 PM, Ric & Jude Raftis at [EMAIL PROTECTED] wrote:

> I think your background should be background-color:#FFD;
> 
> I am not getting any change in background in either Firefox or IE or border.
> I think you need to define a style for link, visited, hover and active in
> that order for it all to work.  You may also need to include a DTD at the
> head of your document.

Hmm, right you are, does not work in FF, can someone maybe give me a example
of how to do this, start to finish, where you have a list of links,
vertical, and hovering anywhere in the row will highlight that row
background, and also toggle the link color of the text, even if it is not
100% as wide as the row.

-- 
-
Scott HanedaTel: 415.898.2602
 Novato, CA U.S.A.


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Color change on row hover

[Richard Grevers]

On 7/12/05, Scott Haneda <[EMAIL PROTECTED]> wrote:
> on 7/11/05 6:02 PM, Richard Grevers at [EMAIL PROTECTED] wrote:
> 
> > On 7/12/05, Scott Haneda <[EMAIL PROTECTED]> wrote:
> >> .tRow:hover {
> >> background: #FFD;
> >> border: 1px solid #EFE;
> >> color: 3F0;
> >> }
> >>
> >> I use the above CSS on a table, when you hover over the  it changes the
> >> background to yellow, but the links inside it are not getting the color
> >> change to green that I am wanting, unless of course, you are right over the
> >> text, which I do not want.
> >>
> > You need to apply display:block to the links to achieve that. (And
> > possibly a width: 100%).
> > That green is incredibly hard to read IMO.
> 
> I don't get to pick the colors :-)
> How is adding display: block to the links, which are not even hovered over,
> going to do anything for me, it is the tr that is hovered, and when that
> happens, I want the color: to change.

It causes the link to occupy the whole of the td, which in turn
occupies the whole of the tr. In fact, with the links as blocks you
can probably set the hover style on a rather than tr, with the added
benefit that it will now work in IE. It may be necessary to define
height, width or padding to get the a's the way you like them.


-- 
Richard Grevers
New Plymouth, New Zealand
Orphan Gmail invites free to good homes.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] Color change on row hover

[Ric & Jude Raftis]

I think your background should be background-color:#FFD;

I am not getting any change in background in either Firefox or IE or border.
I think you need to define a style for link, visited, hover and active in
that order for it all to work.  You may also need to include a DTD at the
head of your document.

Regards,

Ric

> Subject: [css-d] Color change on row hover
> 
> .tRow:hover {
> background: #FFD;
> border: 1px solid #EFE;
> color: 3F0;
> }
> 
> I use the above CSS on a table, when you hover over the  it changes
> the
> background to yellow, but the links inside it are not getting the color
> change to green that I am wanting, unless of course, you are right over
> the
> text, which I do not want.
> 
> You can see a test case here:
> 

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Color change on row hover

[Scott Haneda]

on 7/11/05 6:02 PM, Richard Grevers at [EMAIL PROTECTED] wrote:

> On 7/12/05, Scott Haneda <[EMAIL PROTECTED]> wrote:
>> .tRow:hover {
>> background: #FFD;
>> border: 1px solid #EFE;
>> color: 3F0;
>> }
>> 
>> I use the above CSS on a table, when you hover over the  it changes the
>> background to yellow, but the links inside it are not getting the color
>> change to green that I am wanting, unless of course, you are right over the
>> text, which I do not want.
>> 
> You need to apply display:block to the links to achieve that. (And
> possibly a width: 100%).
> That green is incredibly hard to read IMO.

I don't get to pick the colors :-)
How is adding display: block to the links, which are not even hovered over,
going to do anything for me, it is the tr that is hovered, and when that
happens, I want the color: to change.
-- 
-
Scott HanedaTel: 415.898.2602
 Novato, CA U.S.A.


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Color change on row hover

[Richard Grevers]

On 7/12/05, Scott Haneda <[EMAIL PROTECTED]> wrote:
> .tRow:hover {
> background: #FFD;
> border: 1px solid #EFE;
> color: 3F0;
> }
> 
> I use the above CSS on a table, when you hover over the  it changes the
> background to yellow, but the links inside it are not getting the color
> change to green that I am wanting, unless of course, you are right over the
> text, which I do not want.
> 
You need to apply display:block to the links to achieve that. (And
possibly a width: 100%).
That green is incredibly hard to read IMO.
-- 
Richard Grevers
New Plymouth, New Zealand
Orphan Gmail invites free to good homes.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/