Hi,
I am trying to style using <ui:style> the TabLayoutPanel. Using
Firebug, I determined that I want to change margin-left in ".gwt-
TabLayoutPanel .gwt-TabLayoutPanelTab" from 6px to 0px. This styling
comes from me using the Standard theme (and no other CSS file is
used).
I have figured out the if I copy/paste the TabLayoutPanel* elements
from standard.css to my own CSS file AND use the !important attribute,
I can then override the style from standard.css to achieve what I
want.
However, I am unable to do the same thing using <ui:style> and then
setStyle/addStyelNames. Assuming I have the following defined (and
only inheriting the Standard theme - no CSS file defined):
<ui:style>
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab
{
margin-left: 0px;
padding: 3px 6px 3px 6px;
cursor: pointer;
cursor: hand;
color: black;
font-weight: bold;
text-align: center;
background: #d0e4f6;
}
</ui:style>
<g:TabLayoutPanel ui:field="tabPanel" barUnit="PX" barHeight="20"
addStyleNames="{style.gwt-TabLayoutPanel} {style.gwt-
TabLayoutPanelTab}" >
The compiler (Eclipse) just doesn't recognise the style name in
addStyleNames. I've tried different variations such as "{style.gwt-
TabLayoutPanel gwt-TabLayoutPanelTab}" and "{style.gwt-
TabLayoutPanel .gwt-TabLayoutPanelTab}", etc, etc, but no banana.
Compiler just does not like it.
So the question is how do you alter the style of tabs when using
inline <ui:style> and there is more than one label (.gwt-
TabLayoutPanel .gwt-TabLayoutPanelTab)?
Thanks in advance,
Bernmeister.
--
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.
