This is the reason UI objects have a setStylePrimaryName and addStyleName 
(and addStyleDependentName): change the primary name of your widget to 
something other than the default gwt-TabLayoutPanel, or add another style 
name (class) to the widget, and adapt your CSS. Your selector will look 
like ".myAwesomeTabLayoutPanel .gwt-TabLayoutPanelContentContainer" (you'll 
have to style "everything" in your widget though, not just the content 
area, if myAwesomeTabLayoutPanel is the primary style name; this doesn't 
apply if you used addStyleName), or ".gwt-TabLayoutPanel.myAwesomeWidget 
.gwt-TabLayoutPanelContentContainer" (if you used addStyleName and possibly 
use the same style name with other widgets)

Beware of nesting though, if you put tab layout panels inside tab layout 
panels (even with intermediary widgets) then the selector could match a 
panel you don't want to; in that case, use more specific operators in the 
selector (such as ">" or maybe :not())

On Tuesday, January 6, 2015 10:00:50 AM UTC+1, Magnus wrote:
>
> Hi,
>
> I would like to style the content area of a TabLayoutPanel, but only for a 
> specific one.
>
> I know that I can change it by placing the following into the CSS file 
> included by my host page:
>
> .gwt-TabLayoutPanel .gwt-TabLayoutPanelContentContainer
> {
>   border-color: #ccc;
>   border-style: solid;
>   background: #ff0000;
> }
>
>
> But this affects all instance of TabLayoutPanel. How can I apply it to 
> only one instance?
>
> I know how to put CSS into a client bundle, but how can I apply that to a 
> single widget?
>
> Thanks
> Magnus
>
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

Reply via email to