Changing Modularity Lite Background

apppilot · Member · Jun 19, 2011 at 2:58 pm
Copy link

Add topic to favorites
I have a strange issue with the Modularity Lite theme , I have a checkered background which looks fine but on top of this I have another background this time a plain dark one with opacity which shows the checkered background behind it.

The problem is that although on some computers it looks great on others it looks like there is no opacity on the plain background which makes everything look horrible and really dark. Is there a way to fix this?

The site is : http://apppilot.wordpress.com

Thanks :)

The blog I need help with is: (visible only to logged in users)
michiecat · Staff · Jun 20, 2011 at 4:38 pm
Copy link
Hi there,

Unfortunately it is difficult to predict exactly how images will look on different monitors. Furthermore, monitor brightness varies based on the users’ brightness settings as well as on the monitor itself, and it’s hard to account for them all. If you’re worried that the image will be too dark, have you tried reducing the opacity of the plain background a bit more?
apppilot · Member · Jun 21, 2011 at 11:39 pm
Copy link
Hi michiecat,

Thanks for the advice , I’ve been trying to do what you mentioned but I cant figure out how? I can change the background layer easily ( the one I uploaded) but I cant figure out how to reduce the opacity on the plain background?

Thanks again.
iamtakashi · Staff · Jun 22, 2011 at 3:47 pm
Copy link
Hi there,

You would need to change the theme CSS (It requires Custom Design upgrade).

After you get the upgrade, try add the following.

.container {
background:rgba(0,0,0,.3);
}

You can specify the color in RGB with the first three numbers. (This case is black.)
The last number is where you specify how dark you want it to be. The higher the number, the closer the color will be.

Bare in mind this method only works on modern browsers (Firefox 3+, Opera 10.1+, Chrome 2+, Safari 3.1+).

Cheers!

No items found.