myfaces-users mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Simon Lessard" <simon.lessar...@gmail.com>
Subject Re: [Trinidad] Skinning problems
Date Tue, 31 Jul 2007 13:58:51 GMT
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
Mime
View raw message