Re: [css-d] CSS rollover effect problems

[Ingo Chao]

jack fredricks schrieb:

if it's an IE (only) hack, should it be escaped for IE (only)?


Hmm, in my percentages demo I encountered the problem, and worked this
out for me: background-position:1%; because constructs like

#menu a:hover .menuItemBracket {color:#ff;}

seem not to inform IE about the fact that it must redraw the container 
on hover.


Yes, I think it should be commented like the Holly Hack, but I don't 
know if IEmac suffers from the same problem.


/* to insist on a redraw in IE6, hide from IE-mac \*/
* html #menu a:hover {background-position: 0 0;}
/* end hide */

might be less worse when there is already a background-image. :)

I don't know if anyone uses this position-form of the "hack", or if this 
is a hack at all. I think it's a common little problem, and I saw other 
workarounds like changing the text-decoration, or the background-color.
It's just important to find a solution that indicates a change to IE and 
doesn't interact too much.


Ingo











__
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] CSS rollover effect problems

[jack fredricks]

if it's an IE (only) hack, should it be escaped for IE (only)?


On 6/3/05, Ingo Chao <[EMAIL PROTECTED]> wrote:
> Lea Anna Davis schrieb:
> > Adding the code  #menu a:hover {background:1%;} worked! How bizarre. I
> > have no idea why IE needs to have this code.
> 
> background:1%; tries to position a background-image (no matter if there
> is one or not) and reminds IE to do something: redraw all possible
> affected elements.
> Any background change on hover does this trick. This 1% has no sense at
> all. It's short, does not harm (mostly) the layout, and everybody knows
> instantly that this must be a hack, that's all.
> 
> Ingo
> 
> 
> 
> __
> 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/
>
__
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] CSS rollover effect problems

[Ingo Chao]

Lea Anna Davis schrieb:
Adding the code  #menu a:hover {background:1%;} worked! How bizarre. I 
have no idea why IE needs to have this code.


background:1%; tries to position a background-image (no matter if there 
is one or not) and reminds IE to do something: redraw all possible 
affected elements.
Any background change on hover does this trick. This 1% has no sense at 
all. It's short, does not harm (mostly) the layout, and everybody knows 
instantly that this must be a hack, that's all.


Ingo



__
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] CSS rollover effect problems

[Lea Anna Davis]

Adding the code  #menu a:hover {background:1%;} worked! How bizarre. I 
have no idea why IE needs to have this code.


Thank You!

Lea Anna

Ingo Chao wrote:


Lea Anna Davis schrieb:

Im trying to create an effect where some of the linked text 
(enclosing brackets in this case) change color when hovered.  ... The 
following code works in Firefox but not IE -specifically IE 6.


|#menu a {
display:block;
color: #ff;
font-weight: bold;
text-decoration: none;
padding-top: 5px;
margin-left: 10px;
}

||#menu ||a:link .menuItemBracket, ||#menu ||a:visited 
.menuItemBracket {

color:#00;
}

||#menu ||a:hover .menuItemBracket, ||#menu ||a:active 
.menuItemBracket {

color:#ff;
}



yes, IE6 is, say a little bit picky when it comes to pseudoclasses

#menu a:hover {background:1%;}

should fix it by announcing the :hover transition explicitly.

Ingo



__
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] CSS rollover effect problems

[Thierry Koblentz]

Lea Anna Davis wrote:
>>> #menu ||a:link .menuItemBracket, ||#menu ||a:visited
>>> .menuItemBracket { 
> color:#00;
> }

> 
> [ Good
> News ]
> 

Why not removing the class and go with:
#menu a:hover span {}

Thierry | http://www.TJKDesign.com
__
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] CSS rollover effect problems

[Ingo Chao]

Lea Anna Davis schrieb:
Im trying to create an effect where some of the linked text (enclosing 
brackets in this case) change color when hovered.  ... The following code works in Firefox but not IE -specifically IE 6.


|#menu a {
display:block;
color: #ff;
font-weight: bold;
text-decoration: none;
padding-top: 5px;
margin-left: 10px;
}

||#menu ||a:link .menuItemBracket, ||#menu ||a:visited .menuItemBracket {
color:#00;
}

||#menu ||a:hover .menuItemBracket, ||#menu ||a:active .menuItemBracket {
color:#ff;
}


yes, IE6 is, say a little bit picky when it comes to pseudoclasses

#menu a:hover {background:1%;}

should fix it by announcing the :hover transition explicitly.

Ingo
__
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/

[css-d] CSS rollover effect problems

[Lea Anna Davis]

Im trying to create an effect where some of the linked text (enclosing 
brackets in this case) change color when hovered.


(In reality the brackets will be the same color as the background and 
will seem to appear on hover as a result of a color change.)


The Link looks like this [Good News] and the brackets should change to 
red on hover.


I'm trying to use spans around the brackets inside the anchor tag.

The following code works in Firefox but not IE -specifically IE 6.

Thanks in advance for all responses.

Lea Anna

|#menu a {
display:block;
color: #ff;
font-weight: bold;
text-decoration: none;
padding-top: 5px;
margin-left: 10px;
}

||#menu ||a:link .menuItemBracket, ||#menu ||a:visited .menuItemBracket {
color:#00;
}

||#menu ||a:hover .menuItemBracket, ||#menu ||a:active .menuItemBracket {
color:#ff;
}


[ Good 
News ]


|
__
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/