CSS is often hierarchical in GWT widgets. You have a primary style
name and then additional secondary styles that are swapped out
according to user actions (like select, hover etc). With a Tab panel
the tabs are controlled by the TabBar class, and you can see it has a
primary style gwt-TabBar and a selection of additional styles.
.gwt-TabBar {
}
.gwt-TabBar .gwt-TabBarFirst {
}
.gwt-TabBar .gwt-TabBarRest {
}
.gwt-TabBar .gwt-TabBarItem {
}
.gwt-TabBar .gwt-TabBarItem-selected {
}
To custom style TabBars differently all you have to do is copy this
template CSS and replace gwt-TabBar with my-TabBar. Then you set the
style as:
myTabPanel.getTabBar().setPrimaryStyleName("my-TabBar");
Do not change the gwt- part of the secondary style names as the
internal TabBar code won't recognize them. E.g. you end up with
.my-TabBar .gwt-TabBarItem-selected {
}
So you can have as many different styles for the same GWT widget class
within the same application as you like.
On Feb 27, 4:25 am, Ananda <[email protected]> wrote:
> I belive you can do it..
> Use the different style name , it will work
>
> Regards,
> AR
>
> -----Original Message-----
> From: [email protected]
>
> [mailto:[email protected]] On Behalf Of Master Shake
> Sent: Friday, February 27, 2009 8:18 AM
> To: Google Web Toolkit
> Subject: Two TabPanels, different CSS styles
>
> Is there a way to have different css styles for two of the same GWT
> composite types (i.e. TabPanels) in the same document? I have two
> TabPanels and I want one TabPanel to have larger tabs...
>
> Thanks,
> -ms
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/Google-Web-Toolkit?hl=en
-~----------~----~----~----~------~----~------~--~---
