StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POChange CSS of GWT tabBar Items
text
Body
copied!<p><strong>Update:</strong> <em>I got the first part working, but the corners are not. See part 2 below.</em></p> <p>How do you apply a style to a tabBar (in GWT) so that you can a single tabBar at a time? I have a few different tabPanels that need to have different styles but I can't figure out how to correctly apply the style to the bar and then how to add that style to my CSS.</p> <p>When I do something like:</p> <pre><code>tabBar.addstyle("thisisastyle"); </code></pre> <p>It adds the style for the whole bar, I want to apply it to a set of items, specifically changing the background colors for individual tabs. I am using a DecoratedTabPanel and I have my own set of images for rounded corners and such that I would like to use. Also, once the style is correctly applied, how do I call it in the CSS? My current attempt is like so:</p> <pre><code>.topTabs .gwt-DecoratedTabBar .tabMiddleCenter { </code></pre> <p><strong>Part 2</strong></p> <p>All the other CSS styles are easily applied after setting a style name to the tab bar and addressing them as follows:</p> <pre><code>.customizedStyleName .tabTopCenter { background-image: url('images/centerTopImage.gif'); } </code></pre> <p>but this doesn't appear to work for the two corners, the base GWT overrides my CSS. The CSS for the right corner looks like this:</p> <pre><code>html > body .gwt-DecoratedTabBar .tabTopRight { </code></pre> <p>when inspecting it in Firebug (yah Firefox). Can anyone tell me how to override this?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload