Thanks John ;)
that's similar to what I was doing (before I saw your reply). I'll try it
your way, as my seems a bit "messier" hehe
Edd
John Krasnay wrote:
>
> I tried to explain this in an earlier thread, but I'm afraid I wasn't
> too successful. I'll give it another shot. Suppose your outer tabs are
> defined on a page like this:
>
> <div wicket:id="outerTabs" class="outerTabs"></div>
>
> When you attached the TabbedPanel component to it, it renders like this:
>
> <div class="outerTabs">
> <div class="tab-row">
> <ul>
> <li> ...</li
> </ul>
> </div>
> ...your panel...
> </div>
>
> You can make them horizontal by doing something like this in CSS:
>
> div.outerTabs li { display: inline; }
>
> Now, suppose your panel has a set of inner tabs, with this markup:
>
> <div wicket:id="innerTabs" class="innerTabs"></div>
>
> The rendered HTML now looks like this:
>
> <div class="outerTabs">
> <div class="tab-row">
> <ul>
> <li> ...</li
> </ul>
> </div>
>
> <div class="innerTabs">
> <div class="tab-row">
> <ul>
> <li> ... </li>
> </ul>
> </div>
>
> your inner panel
>
> </div>
>
> </div>
>
> To make the inner ones vertical, you'll want to float the inner tab row
> left and render it's <li>'s as blocks:
>
> div.innerTabs div.tab-row { float: left; }
> div.innerTabs li { display: block; }
>
> You'll have to play a bit with the CSS to get it nice, but that's the
> general idea.
>
> The only tricky part is that the inner <li> elements are styled by both
> the (div.outerTabs li) and (div.innerTabs li) elements, so you have to
> make sure of the following:
>
> 1. put the (div.innerTabs li) later in the stylesheet, so that it's
> properties override those from (div.outerTabs li).
>
> 2. anything you do in (div.outerTabs li) that you don't want for the
> inner tabs, you have to explicitly undo in (div.innerTabs li), for
> example:
>
> div.outerTabs li { font-weight: bold; }
>
> /* Have to do this, or the inner tabs will be bold too */
> div.innerTabs li { font-weight: normal; }
>
> Does this help?
>
> jk
>
> On Thu, May 17, 2007 at 01:30:24PM -0700, eddmosphere wrote:
>>
>> How would I do that? Not sure I understood..
>>
>> Thanks, Edd
>>
>>
>> igor.vaynberg wrote:
>> >
>> > if you set a class on the tab panel then you can use that class to
>> scope
>> > the
>> > css styles properly
>> >
>> > -igor
>> >
>> >
>> > On 2/20/07, burnayev <[EMAIL PROTECTED]> wrote:
>> >>
>> >>
>> >> Thank you Igor.
>> >>
>> >> I'm trying to implement nested tabs - basic navigation pattern where
>> you
>> >> have horizontal tabs on top and vertical tabs at left within a
>> particular
>> >> tab panel.
>> >>
>> >> I fiddled a little with styling the inner tabs and haven't come to a
>> >> satisfactory result so far. The problem seems to be the fact that both
>> >> tab
>> >> panels internally use the same CSS classes for styling, namely tab-row
>> >> and
>> >> tab-panel.
>> >>
>> >> Is there a way to dynamically change the associated classes?
>> >>
>> >> Thanks,
>> >> Borys
>> >>
>> >>
>> >> igor.vaynberg wrote:
>> >> >
>> >> > you can style tabbedpanel in extensions
>> >> >
>> >> > the tabs are just a <ul>
>> >> >
>> >> > -igor
>> >> >
>> >> >
>> >> > On 2/19/07, burnayev <[EMAIL PROTECTED]> wrote:
>> >> >>
>> >> >>
>> >> >> How do I create vertically stacked tabs? Is it possible to style
>> >> and/or
>> >> >> extend the extensions tab component or do I have to create my own?
>> >> >> --
>> >> >
>> >>
>> >> --
>> >> View this message in context:
>> >> http://www.nabble.com/Vertical-Tabs-tf3254943.html#a9062788
>> >> Sent from the Wicket - User mailing list archive at Nabble.com.
>> >>
>> >>
>> >>
>> -------------------------------------------------------------------------
>> >> Take Surveys. Earn Cash. Influence the Future of IT
>> >> Join SourceForge.net's Techsay panel and you'll get the chance to
>> share
>> >> your
>> >> opinions on IT & business topics through brief surveys-and earn cash
>> >>
>> http://www.techsay.com/default.php?page=join.php&p=sourceforge&CID=DEVDEV
>> >> _______________________________________________
>> >> Wicket-user mailing list
>> >> Wicket-user@lists.sourceforge.net
>> >> https://lists.sourceforge.net/lists/listinfo/wicket-user
>> >>
>> >
>> >
>> -------------------------------------------------------------------------
>> > Take Surveys. Earn Cash. Influence the Future of IT
>> > Join SourceForge.net's Techsay panel and you'll get the chance to share
>> > your
>> > opinions on IT & business topics through brief surveys-and earn cash
>> >
>> http://www.techsay.com/default.php?page=join.php&p=sourceforge&CID=DEVDEV
>> > _______________________________________________
>> > Wicket-user mailing list
>> > Wicket-user@lists.sourceforge.net
>> > https://lists.sourceforge.net/lists/listinfo/wicket-user
>> >
>> >
>>
>> --
>> View this message in context:
>> http://www.nabble.com/Vertical-Tabs-tf3254943.html#a10671840
>> Sent from the Wicket - User mailing list archive at Nabble.com.
>>
>>
>> -------------------------------------------------------------------------
>> This SF.net email is sponsored by DB2 Express
>> Download DB2 Express C - the FREE version of DB2 express and take
>> control of your XML. No limits. Just data. Click to get it now.
>> http://sourceforge.net/powerbar/db2/
>> _______________________________________________
>> Wicket-user mailing list
>> Wicket-user@lists.sourceforge.net
>> https://lists.sourceforge.net/lists/listinfo/wicket-user
>
> -------------------------------------------------------------------------
> This SF.net email is sponsored by DB2 Express
> Download DB2 Express C - the FREE version of DB2 express and take
> control of your XML. No limits. Just data. Click to get it now.
> http://sourceforge.net/powerbar/db2/
> _______________________________________________
> Wicket-user mailing list
> Wicket-user@lists.sourceforge.net
> https://lists.sourceforge.net/lists/listinfo/wicket-user
>
>
--
View this message in context:
http://www.nabble.com/Vertical-Tabs-tf3254943.html#a10675797
Sent from the Wicket - User mailing list archive at Nabble.com.
-------------------------------------------------------------------------
This SF.net email is sponsored by DB2 Express
Download DB2 Express C - the FREE version of DB2 express and take
control of your XML. No limits. Just data. Click to get it now.
http://sourceforge.net/powerbar/db2/
_______________________________________________
Wicket-user mailing list
Wicket-user@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/wicket-user
