You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Okan Çetin <ok...@gmail.com> on 2007/07/31 08:28:01 UTC
[Trinidad] Skinning problems
Hi;
I am getting problems with css skinning for trinidad.
It is easy that doing tab menus with classical css.
I want to convert css tab menu skin into trinidad css format. But there is
no completely manual.
How can I know "tabs a hover" is equal to "af | panelTabbed::tab-link:hover"
There is a manual >
http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
but panelTabbed has little explanation like this :
Name Description af|panelTabbed Selector that renders on the root dom
element of the component.
#tabs {
background:#BBD9EE none repeat scroll 0%;
float:left;
font-size:93%;
line-height:normal;
width:100%;
}
#tabs ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0pt;
padding:10px 10px 0pt 50px;
}
#tabs li {
display:inline;
margin:0pt;
padding:0pt;
}
#tabs a {
background:transparent url(tableft.gif) no-repeat scroll left top;
float:left;
margin:0pt;
padding:0pt 0pt 0pt 4px;
text-decoration:none;
}
#tabs a span {
background:transparent url(tabright.gif) no-repeat scroll right top;
color:#666666;
display:block;
float:left;
padding:5px 15px 4px 6px;
}
#tabs a span {
float:none;
}
#tabs a:hover span {
color:#FF9834;
}
#tabs a:hover {
background-position:0% -42px;
}
#tabs a:hover span {
background-position:100% -42px;
}
--
~
otomatik oluşturuldu:
http://ocetin.net/log
http://linux.beykent.edu.tr
Re: [Trinidad] Skinning problems
Posted by Martin Marinschek <ma...@gmail.com>.
This one is a bit hidden, but it is more actual for Trinidad-selectors:
http://myfaces.apache.org/trinidad/skin-selectors.html
regards,
Martin
On 7/31/07, Okan Çetin <ok...@gmail.com> wrote:
>
> Hi;
> Thanks for reply;
>
> But actually in this situation main problem is how can I know the key word
> (tab-link?) I could not find completely manual. There is a document [1] but
> it has not contain all parameters of css tags.
>
> [1]
> http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
>
> On 31/07/07, Simon Lessard <si...@gmail.com> wrote:
> >
> > Hello Okan,
> >
> > How can I know "tabs a hover" is equal to "af |
> > panelTabbed::tab-link:hover"
> > You need to understand the selector terminology for that. Let break down
> > that selector:
> > af|panelTabbed = we're skinning the panelTabbed component
> > ::tab-link = we're skinning the link part of a tab in the panelTabbed
> > component
> > :hover = when the cursor move over the tab-link (note that this one is a
> > standard CSS :hover and since MSIE 6 does not support :hover on many
> > elements, it has to be used on a link, hence the ::tab-link)
> >
> >
> > Does that help?
> >
> > ~ Simon
> >
> > On 7/31/07, Okan Çetin < okancetin@gmail.com> wrote:
> > >
> > > Hi;
> > > I am getting problems with css skinning for trinidad.
> > > It is easy that doing tab menus with classical css.
> > > I want to convert css tab menu skin into trinidad css format. But
> > > there is no completely manual.
> > > How can I know "tabs a hover" is equal to "af |
> > > panelTabbed::tab-link:hover"
> > >
> > > There is a manual > http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
> > >
> > >
> > > but panelTabbed has little explanation like this :
> > >
> > > Name Description af|panelTabbed Selector that renders on the root dom
> > > element of the component.
> > >
> > >
> > > #tabs {
> > > background:#BBD9EE none repeat scroll 0%;
> > > float:left;
> > > font-size:93%;
> > > line-height :normal;
> > > width: 100%;
> > > }
> > > #tabs ul {
> > > list-style-image:none;
> > > list-style-position:outside;
> > > list-style-type :none;
> > > margin :0pt;
> > > padding: 10px 10px 0pt 50px;
> > > }
> > > #tabs li {
> > > display:inline;
> > > margin:0pt;
> > > padding :0pt;
> > > }
> > > #tabs a {
> > > background:transparent url(tableft.gif) no-repeat scroll left top ;
> > > float:left;
> > > margin:0pt;
> > > padding:0pt 0pt 0pt 4px;
> > > text-decoration:none;
> > > }
> > > #tabs a span {
> > > background:transparent url(tabright.gif ) no-repeat scroll right top;
> > > color:#666666 ;
> > > display:block ;
> > > float:left;
> > > padding:5px 15px 4px 6px;
> > > }
> > > #tabs a span {
> > > float: none;
> > > }
> > > #tabs a:hover span {
> > > color:#FF9834;
> > > }
> > > #tabs a:hover {
> > > background-position: 0% -42px;
> > > }
> > > #tabs a:hover span {
> > > background-position:100% -42px;
> > > }
> > >
> > >
> > >
> > >
> > > --
> > > ~
> > > otomatik oluşturuldu:
> > > http://ocetin.net/log
> > > http://linux.beykent.edu.tr
> >
> >
> >
>
>
> --
> ~
> otomatik oluşturuldu:
> http://ocetin.net/log
> http://linux.beykent.edu.tr
>
--
http://www.irian.at
Your JSF powerhouse -
JSF Consulting, Development and
Courses in English and German
Professional Support for Apache MyFaces
Re: [Trinidad] Skinning problems
Posted by Okan Çetin <ok...@gmail.com>.
Hi;
Thanks for reply;
But actually in this situation main problem is how can I know the key word
(tab-link?) I could not find completely manual. There is a document [1] but
it has not contain all parameters of css tags.
[1]
http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
On 31/07/07, Simon Lessard <si...@gmail.com> wrote:
>
> Hello Okan,
>
> How can I know "tabs a hover" is equal to "af |
> panelTabbed::tab-link:hover"
> You need to understand the selector terminology for that. Let break down
> that selector:
> af|panelTabbed = we're skinning the panelTabbed component
> ::tab-link = we're skinning the link part of a tab in the panelTabbed
> component
> :hover = when the cursor move over the tab-link (note that this one is a
> standard CSS :hover and since MSIE 6 does not support :hover on many
> elements, it has to be used on a link, hence the ::tab-link)
>
>
> Does that help?
>
> ~ Simon
>
> On 7/31/07, Okan Çetin <ok...@gmail.com> wrote:
> >
> > Hi;
> > I am getting problems with css skinning for trinidad.
> > It is easy that doing tab menus with classical css.
> > I want to convert css tab menu skin into trinidad css format. But there
> > is no completely manual.
> > How can I know "tabs a hover" is equal to "af |
> > panelTabbed::tab-link:hover"
> >
> > There is a manual > http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
> >
> >
> > but panelTabbed has little explanation like this :
> >
> > Name Description af|panelTabbed Selector that renders on the root dom
> > element of the component.
> >
> >
> > #tabs {
> > background:#BBD9EE none repeat scroll 0%;
> > float:left;
> > font-size:93%;
> > line-height :normal;
> > width: 100%;
> > }
> > #tabs ul {
> > list-style-image:none;
> > list-style-position:outside;
> > list-style-type :none;
> > margin :0pt;
> > padding: 10px 10px 0pt 50px;
> > }
> > #tabs li {
> > display:inline;
> > margin:0pt;
> > padding :0pt;
> > }
> > #tabs a {
> > background:transparent url(tableft.gif) no-repeat scroll left top ;
> > float:left;
> > margin:0pt;
> > padding:0pt 0pt 0pt 4px;
> > text-decoration:none;
> > }
> > #tabs a span {
> > background:transparent url(tabright.gif ) no-repeat scroll right top;
> > color:#666666 ;
> > display:block ;
> > float:left;
> > padding:5px 15px 4px 6px;
> > }
> > #tabs a span {
> > float: none;
> > }
> > #tabs a:hover span {
> > color:#FF9834;
> > }
> > #tabs a:hover {
> > background-position: 0% -42px;
> > }
> > #tabs a:hover span {
> > background-position:100% -42px;
> > }
> >
> >
> >
> >
> > --
> > ~
> > otomatik oluşturuldu:
> > http://ocetin.net/log
> > http://linux.beykent.edu.tr
>
>
>
--
~
otomatik oluşturuldu:
http://ocetin.net/log
http://linux.beykent.edu.tr
Re: [Trinidad] Skinning problems
Posted by Simon Lessard <si...@gmail.com>.
Hello Okan,
How can I know "tabs a hover" is equal to "af | panelTabbed::tab-link:hover"
You need to understand the selector terminology for that. Let break down
that selector:
af|panelTabbed = we're skinning the panelTabbed component
::tab-link = we're skinning the link part of a tab in the panelTabbed
component
:hover = when the cursor move over the tab-link (note that this one is a
standard CSS :hover and since MSIE 6 does not support :hover on many
elements, it has to be used on a link, hence the ::tab-link)
Does that help?
~ Simon
On 7/31/07, Okan Çetin <ok...@gmail.com> wrote:
>
> Hi;
> I am getting problems with css skinning for trinidad.
> It is easy that doing tab menus with classical css.
> I want to convert css tab menu skin into trinidad css format. But there is
> no completely manual.
> How can I know "tabs a hover" is equal to "af |
> panelTabbed::tab-link:hover"
>
> There is a manual >
> http://www.oracle.com/technology/products/adf/adffaces/11/doc/skin-selectors.html
>
> but panelTabbed has little explanation like this :
>
> Name Description af|panelTabbed Selector that renders on the root dom
> element of the component.
>
>
> #tabs {
> background:#BBD9EE none repeat scroll 0%;
> float:left;
> font-size:93%;
> line-height :normal;
> width: 100%;
> }
> #tabs ul {
> list-style-image:none;
> list-style-position:outside;
> list-style-type :none;
> margin :0pt;
> padding: 10px 10px 0pt 50px;
> }
> #tabs li {
> display:inline;
> margin:0pt;
> padding :0pt;
> }
> #tabs a {
> background:transparent url(tableft.gif) no-repeat scroll left top ;
> float:left;
> margin:0pt;
> padding:0pt 0pt 0pt 4px;
> text-decoration:none;
> }
> #tabs a span {
> background:transparent url(tabright.gif ) no-repeat scroll right top;
> color:#666666 ;
> display:block ;
> float:left;
> padding:5px 15px 4px 6px;
> }
> #tabs a span {
> float: none;
> }
> #tabs a:hover span {
> color:#FF9834;
> }
> #tabs a:hover {
> background-position: 0% -42px;
> }
> #tabs a:hover span {
> background-position:100% -42px;
> }
>
>
>
>
> --
> ~
> otomatik oluşturuldu:
> http://ocetin.net/log
> http://linux.beykent.edu.tr