views:

1289

answers:

2

Hi,

I have some html files with their own css. I want to use them in a gwt application so i copied the html and the css files in the application.

The problem is when i open the html it uses the gwt theme style. For example in my css the html 'body' background color is black, but it looks white unless i deactivate the theme.

How could I override the gwt theme style and use my css styles???

thx a lot....

+1  A: 

You can override the styles of GWT by using the keyword !important in all your css of the html files, for example, if one of your html file contains this css:

background-color:#000000;

Then you should write it like this:

background-color:#000000 !important;

Do the same for all your styles in html files.

Note that using !important is not the best way, if you can find any better alternatives you should go for them first.

Sarfraz
+9  A: 

Like Sarfaz said - !important should be your last resort as it kind of defeats the whole concept of Cascading Style Sheets.

Anyway, in GWT, in order to easily override the core GWT styles contained in the theme you selected, you should locate your module file (the one that has a file name ending on *.gwt.xml), then locate the line where you declare your theme and put your custom/whatever stylesheet after it, like this:

<inherits name='com.google.gwt.user.theme.standard.Standard' />
<stylesheet src="CustomStylesheet.css" />

Note, however, that for GWT 2.0 CssResource and UiBinder is recommended.

Be sure to read the appropriate section of the docs for more pointers.

Igor Klimer