You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Maiko Rocha <ma...@gmail.com> on 2010/12/15 20:07:46 UTC
-tr-rule-ref issues
Hi all,
I'm trying to use the -tr-rule-ref modifier but for some reason is not
working for me. Here's the content of my skin CSS file:
.spriteIcon:alias{
width:16px;
height:16px;
display:block;
padding:0px;
margin:0px;
position:relative;
top:0px;
background-image:url(../../../img/sprite.png);
background-repeat:no-repeat;
background-color:transparent;
}
af|commandButton.favIcon::icon-style{
-tr-rule-ref:selector(".spriteIcon:alias");
background-position:0px 0px;
}
This is what I have (snippet) in my jspx file:
<af:commandButton text="commandButton 1" id="cb1" styleClass="favIcon"
icon="/img/n.gif"/>
And this is the generated HTML output:
<button id="cb1" class="p_AFHoverTarget favIcon af_commandButton"
onclick="return false;"><img
src="/CSS_Sprite_Sample-ViewController-context-root/img/n.gif" alt=""
class="af_commandButton_icon-style"><span title=""
class="af_commandButton_text-by-icon">commandButton 1</span></button>
If I copy the contents of .spriteIcon:alias
to af|commandButton.favIcon::icon-style everything works fine, but if I use
the -tr-rule-ref modifier it doesn't, ie, the generated CSS doesn't have the
rules referenced (HTML snippet is the same in both cases). Any clues?
Thanks in advance!
Maiko
Re: -tr-rule-ref issues
Posted by Maiko Rocha <ma...@gmail.com>.
Alright, I think I found the issue. Looks like that -tr-rule-ref is picky
with CSS class names. I've changed from ".spriteIcon:alias" to
".customImage:alias" and it worked.
[]s!
Maiko
On Wed, Dec 15, 2010 at 5:07 PM, Maiko Rocha <ma...@gmail.com> wrote:
> Hi all,
>
> I'm trying to use the -tr-rule-ref modifier but for some reason is not
> working for me. Here's the content of my skin CSS file:
>
> .spriteIcon:alias{
> width:16px;
> height:16px;
> display:block;
> padding:0px;
> margin:0px;
> position:relative;
> top:0px;
> background-image:url(../../../img/sprite.png);
> background-repeat:no-repeat;
> background-color:transparent;
> }
>
> af|commandButton.favIcon::icon-style{
> -tr-rule-ref:selector(".spriteIcon:alias");
> background-position:0px 0px;
> }
>
> This is what I have (snippet) in my jspx file:
> <af:commandButton text="commandButton 1" id="cb1" styleClass="favIcon"
> icon="/img/n.gif"/>
>
> And this is the generated HTML output:
> <button id="cb1" class="p_AFHoverTarget favIcon af_commandButton"
> onclick="return false;"><img
> src="/CSS_Sprite_Sample-ViewController-context-root/img/n.gif" alt=""
> class="af_commandButton_icon-style"><span title=""
> class="af_commandButton_text-by-icon">commandButton 1</span></button>
>
> If I copy the contents of .spriteIcon:alias
> to af|commandButton.favIcon::icon-style everything works fine, but if I use
> the -tr-rule-ref modifier it doesn't, ie, the generated CSS doesn't have the
> rules referenced (HTML snippet is the same in both cases). Any clues?
>
> Thanks in advance!
> Maiko
>
>
>
Re: -tr-rule-ref issues
Posted by Maiko Rocha <ma...@gmail.com>.
Alright, I think I found the issue. Looks like that -tr-rule-ref is picky
with CSS class names. I've changed from ".spriteIcon:alias" to
".customImage:alias" and it worked.
[]s!
Maiko
On Wed, Dec 15, 2010 at 5:07 PM, Maiko Rocha <ma...@gmail.com> wrote:
> Hi all,
>
> I'm trying to use the -tr-rule-ref modifier but for some reason is not
> working for me. Here's the content of my skin CSS file:
>
> .spriteIcon:alias{
> width:16px;
> height:16px;
> display:block;
> padding:0px;
> margin:0px;
> position:relative;
> top:0px;
> background-image:url(../../../img/sprite.png);
> background-repeat:no-repeat;
> background-color:transparent;
> }
>
> af|commandButton.favIcon::icon-style{
> -tr-rule-ref:selector(".spriteIcon:alias");
> background-position:0px 0px;
> }
>
> This is what I have (snippet) in my jspx file:
> <af:commandButton text="commandButton 1" id="cb1" styleClass="favIcon"
> icon="/img/n.gif"/>
>
> And this is the generated HTML output:
> <button id="cb1" class="p_AFHoverTarget favIcon af_commandButton"
> onclick="return false;"><img
> src="/CSS_Sprite_Sample-ViewController-context-root/img/n.gif" alt=""
> class="af_commandButton_icon-style"><span title=""
> class="af_commandButton_text-by-icon">commandButton 1</span></button>
>
> If I copy the contents of .spriteIcon:alias
> to af|commandButton.favIcon::icon-style everything works fine, but if I use
> the -tr-rule-ref modifier it doesn't, ie, the generated CSS doesn't have the
> rules referenced (HTML snippet is the same in both cases). Any clues?
>
> Thanks in advance!
> Maiko
>
>
>