views:

45

answers:

2

Hi

I can use jquery ui tabs and bend the css used for the tabs.

I m using this to display a background color for the body of the tabs

.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0;
color:white; background-color: #111010; 
backgorund-image: url(backgrounds/g4wd10.gif) 0 0;
opacity:1;  font-size: 12px; }

The backgorund color is displayed but not the image

take a look at here ... the tabs css is in userTab.css

Anything that i m doing wrong or may be this can be done using some jquery thing..

thanks

+6  A: 

Typo .... Change

backgorund-image: url(backgrounds/g4wd10.gif) 0 0;

to

background-image: url(backgrounds/g4wd10.gif) 0 0;
Mr Grok
Doh, better eyes than I :)
Nick Craver
i could not get you... wat is the difference???
Pradyut Bhattacharya
The difference is that the spelling of the word matters. background-image is correct. backgorund-image is not valid and the browser will not recognize it.
John Strickler
@john background-image is correct. backgorund-image is not valid... ??? no offence ... both are the same... or my brain is not working???
Pradyut Bhattacharya
sorry my fault... but only background works... not background-image...
Pradyut Bhattacharya
@Pradyut - background-image works. You were spelling it incorrectly (your spelling = backGORound-image, correct spelling = backGROund-image). When you switched it to background, you must have spelled it correctly as that will also work.
JasCav
@jascav no offence... plz do test...
Pradyut Bhattacharya
@Pradyut - Not sure what you're telling me to test. I'm just pointing out where the spelling problem was (which you seemed confused about). I'm not testing anything because I'm not trying out the code - just trying to help out @Grok.
JasCav
no worries... for clarity @Pradyut this equivalent code (which is more verbose) would work too:.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; color: white; background-color: #111010; background-image: url(../displayScale?id=20 background-position: 0 0; opacity:1; font-size: 12px; }
Mr Grok
A: 

this css works...

.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; 
color:white; background-color: #111010;
background: #111010 url(../displayScale?id=20&full=true) 0 0;
opacity:1;  font-size: 12px; }

the background-image does not work....

i really cant help... this was beyond dreams....

thanks

Pradyut Bhattacharya
Providing an image really did exist at the location 'backgrounds/g4wd10.gif', then there is no reason why the original (minus the typo) would not work. However, it is more efficient to just use "background" and load it with the color and the image as you have now done. In this case, you should now remove the "background-color: #111010;" bit from your new example as it is superfluous.
Mr Grok