My way works if you are "embedding" one navigation pane in the other.
The example I gave would be for the "second" navigation pane, the first
would use the normal styling.
Simons works if you don't mind adding a style class.
Zigc Junk wrote:
Tried again. Yes, the first syntax works.
Thanks a lot
Bill
On Tue, Feb 5, 2008 at 11:20 AM, Simon Lessard
<[EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>> wrote:
Hmmm, the first synthax should work just fine... can you check the
generated CSS to see how the selector was reduced?
On Feb 5, 2008 12:16 PM, Zigc Junk <[EMAIL PROTECTED]
<mailto:[EMAIL PROTECTED]>> wrote:
Just tried both syntax and it does not seem to work. Below is
the html code from Firebug. Note that I changed MyClass to
t_topMenu. Do you know why?
thanks
Bill
<div class="t_topMenu af_navigationPane_tabs">
<table class="" cellspacing="0" cellpadding="0" border="0"
style="display:
inline;" summary="">
</table>
<table class="" cellspacing="0" cellpadding="0" border="0"
style="display:
inline;" summary="">
<tbody style="display: inline;">
<tr>
<td>
<table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="0"
border="0" summary="">
<tbody>
<tr>
<td class="af_navigationPane_tabs-start-join-from-active"/>
</tr>
<tr>
<td class="af_navigationPane_tabs-bottom-end">
<div class="af_navigationPane_tabs-bottom-mid-content"/>
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table class="af_navigationPane_tabs-inactive" cellspacing="0" cellpadding="0"
border="0" summary="">
<tbody>
<tr>
<td class="af_navigationPane_tabs-mid">
<a id="j_id_id50:j_id_id54"
onclick="submitForm('rootForm',1,{source:'j_id_id50:j_id_id54'});return
false;" href="#" name="j_id_id50:j_id_id54">Bills</a>
</td>
</tr>
<tr>
<td class="af_navigationPane_tabs-bottom-mid">
<div class="af_navigationPane_tabs-bottom-mid-content"/>
</td>
</tr>
</tbody>
</table>
</td>
<td>
</td>
</tr>
</tbody>
</table>
On Tue, Feb 5, 2008 at 11:01 AM, Simon Lessard
<[EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>>
wrote:
Hello Bill,
The following should work:
<tr:navigationPane hint="tabs" styleClass="MyClass">
<tr:commandNavigationItem text="Home" />
<tr:commandNavigationItem text="Bills" />
<tr:commandNavigationItem text="Service History" />
</tr:navigationPane>
.MyClass af|navigationPane::tabs-inactive
af|navigationPane::tabs-mid A
{
font-weight: bold;
}
or
af|navigationPane.MyClass::tabs-inactive
af|navigationPane::tabs-mid A
{
font-weight: bold;
}
The best way to know on what element the style class
should be put is by using Firebug.
Regards,
~ Simon
On Feb 5, 2008 11:55 AM, Zigc Junk <[EMAIL PROTECTED]
<mailto:[EMAIL PROTECTED]>> wrote:
Can you be more specific? Assume that I have the
following navigationPane, how can I create a skin that
is ONLY applied to this navigationPane.
<tr:navigationPane hint="tabs">
<tr:commandNavigationItem text="Home" />
<tr:commandNavigationItem text="Bills" />
<tr:commandNavigationItem text="Service
History" />
</tr:navigationPane>
Here is one piece of the skin I created
af|navigationPane::tabs-inactive
af|navigationPane::tabs-mid A {
font-weight: bold;
}
Thanks
Bill
On Feb 5, 2008 10:33 AM, Scott O'Bryan
<[EMAIL PROTECTED] <mailto:[EMAIL PROTECTED]>> wrote:
Zigc Junk wrote:
> I am trying to skin the navigationPane. Since I
have two
> navigationPane (tabs) instances (one top menu
and one secondary menu),
> I want to put a different skin on each of them.
It seems to me that
> there is no way of doing that. I can only create
one skin which will
> be applied to all navigationPane instances. Does
anyone know how to do
> this?
>
> thanks
>
> Bill
Use a compound key. If the second navigation pane
is embedded in the
first one, the key for the second pane might look
something like this:
af|navigationPane-tabs::tab:selected
af|navigationPane-tabs::tab-content
