Background Color Image Transparencies
-
I am trying to swap over from Cyanotype to Grisaille– I like most of Grisaille’s presentation better but am encountering two problems:
1) I want to keep my old color scheme of gold (#bdb198) on dark blue (#253a55), but for whatever reason Grisaille changes the color of its header text and text boxes automatically based on the background color, making this impossible from the Appearance -> Colors menu.
I’ve currently achieved the effect I want by picking a background color that gives me reasonable text and text box colors, than hiding it with a “background image” that’s just a dark blue box. But this isn’t a great solution because it slows down the site’s loading times and makes there be a bright flash as it loads new pages.
Is there a way I can just override one of these elements with CSS to get the scheme I want?
2) For whatever reason, Grisaille seems to put a white background on transparent .png files. This is a terrible default. All those images had transparent corners back when I was using Cyanotype, but now they stick out like sore thumbs. Is this fixable?
The blog I need help with is: (visible only to logged in users)
-
Hi there, when choosing colors from Customize > Colors, the software uses contrast rules so that those with visual impairments can read everything on the site. We can override those with custom CSS. For the main body background, you can remove your background image and then add the following custom CSS.
body { background-color: #253a55 !important; }For the images, that was a decision by the designer, but again we can do away with that with the following CSS.
#primary-content img, #secondary-content img { background: none; border: none; } -
-
- The topic ‘Background Color Image Transparencies’ is closed to new replies.