Desktop css issue?

[ihatecode]

I'm running GXT 2.0.1. and I've been putting together a desktop app, following the sample provided to the letter. I've got almost all of it working except for the fact that the desktop.jpg "background" image is not showing, I just get a white background with the icons and such. Upon initial load in IE you can see the desktop.jpg breifly (like a flicker), but then it gets "covered" by white.

I've been thinking it might be some css issue, but have not yet figured it out. I've got the rest of the css, and images from my resource folder showing up, so it 'seems' that the css and images are being brought in correctly.

My DesktopApp.html css imports look like this
<link rel="stylesheet" type="text/css" href="rsc/desktop/css/desktop.css" />
<link rel="stylesheet" type="text/css" href="rsc/css/gxt-all.css" />

The respective desktop.css has this for the body
html,body {
background: #3d71b8 url(../wallpapers/desktop.jpg) no-repeat left top;
font: normal 12px tahoma, arial, verdana, sans-serif;
margin: 0;
padding: 0;
border: 0 none;
overflow: hidden;
height: 100%;
}

Not even the hex color #3d71b8 is showing. Might this be a z-index issue somewhere, as in something white is "above" the desktop.jpg and hex color?

Any suggestions would help out a tired old developer.

Much thanks. :)

[Matt Kleweno]

The default GWT CSS is taking precedence over the EXT css. I don't really know why. I am not a CSS expert.

I was able to fix this issue by adding !important to the end of the background element in the ${resources}/desktop/css/desktop.css that comes with EXT.

After that it worked.


html,body {
background: #3d71b8 url(../wallpapers/desktop.jpg) no-repeat left top !important;
font: normal 12px tahoma, arial, verdana, sans-serif;
margin: 0;
padding: 0;
border: 0 none;
overflow: hidden;
height: 100%;
}

[foxx]

Thanks Matt this helped me get the background image to render in IE.