Change background color of Top1, Top2 etc

Hi

I want to change the background colors of the modules Top1, Top2 etc. These need to be different colors for each module. I have looked through the css, but cannot see a method to complete this.

Any suggestions would be great.

Many thanks

Steve

Hi,
you have to add suffix to each module you publish in those positions. Go to module settings and add own sufficx to this module for example ' mysuffix'. Remember about whitespace before suffix name. Then go to override.css and add

Code: Select all

.mysuffix {
background:#ffffff;
}


and set your own color value. Remember to enable override.css option in template settings.

Hi

The best way to make it is by using module class suffix. Simply add a module like for example " yellow" (space in front is important) and than add this code to css:

Code: Select all

.yellow {
background-color: yellow;
}


Hi

Many thanks for the two suggestions. I have followed exactly, but there are no changes. Viewing the page code, I can see the div with the module suffix like "box tester". I have enabled css override, but there is nothing in the source to show the background statement?

Any suggestions?

Thx

Steve

Can you give us url to your site ?

Can you give us url to your site ?

It's running in a virtual server whilst I develop it, so there is no way to gain access i am afraid

If you are using cache function, please try delete cache after you add code to override.css if no please paste your override.css file here.

If you are using cache function, please try delete cache after you add code to override.css if no please paste your override.css file here.

Hi

Cache all cleared, no change.

module suffix is simply ' tester'

Override.css below for you. I have also turned on and off in advanced a number of times, just in case


/* Here you can include your override CSS styles */

.tester {
background:#3425ff;
}

Try add !important rule to code:

Code: Select all

.tester {
background:#3425ff !important;
}


Try add !important rule to code:

Code: Select all

.tester {
background:#3425ff !important;
}


That works perfectly.

Thanks so much for the advice.

Steve