x

Transparent colored background, but solid text

Hi, I'm using a spash image for my homepage and need coding for a transparent colored background behind my text, that leaves the text solid.  The coding that I've come up with on the web makes the text transparent too.  Grateful for some guidance.

Thanks.

Phillip

4,914 Views
Message 1 of 12
Report
11 REPLIES 11
Square

Hey @Phillip!  We can't assist with custom questions ourselves, but it might help our css-savvy community members if they could see the page of your live site (assuming it's live).

4,905 Views
Message 2 of 12
Report

Hi Adam, my website isn't live yet, but I'll do as you suggest when it is live.  I'm sure this is a common issue with Weebly users, as our all-important text becomes much less prominent when it takes on the transparency of the background colour.

Thanks

Phillip

4,902 Views
Message 3 of 12
Report

Hi, my live site is at www.grcl.consulting

Any assistance regarding my home page would be much appreciated.  I think it would look much better if I could make the background colour behind the text transparent while keeping the text solid.  At the moment, the opacity setting affects the text too!

Thanks

Phillip

4,874 Views
Message 4 of 12
Report

Hey man.  Try adding/changing this in main-style.css if you're working there:

.paragraph-color16, .paragraph-color20 { background:none !important; }
4,861 Views
Message 5 of 12
Report

Thanks for your response BJ.  Although it's very simple code that I'm using, I'm not sure where to put our suggestion - as I'm not a coder.  Grateful for any further help.  Here is the coding that I'm using:

}
.paragraph-color41{
color: #7B99E1;
background: #404040;
filter:alpha(opacity=90);
opacity:0.7;
font-family: "Arial";
border-radius: 8px;
font-size: 41px;
font-weight: bold;
padding: 15px 15px 15px 15px;
margin:0 auto;
}

Thanks

Phillip

4,856 Views
Message 6 of 12
Report

Np, in the code you gave change this:

background: #404040;

to this:

background: none;
4,767 Views
Message 7 of 12
Report

Thanks BJ.  I actually want to keep that background color.  My aim is to make that background color more transparent, but keep my text solid i.e. I don't want the transparency of the background color to affect the text.

Any further thoughts gratefully received.

Regards

Phillip

4,762 Views
Message 8 of 12
Report

@Phillip

Try using a color block, instead of a section!

4,184 Views
Message 11 of 12
Report

Thanks for your suggestion.  What finally worked is a "Color Block" app from the Weebly app centre, which was suggested by Weebly.

This may be what you're referring too ...

4,154 Views
Message 11 of 12
Report

I can give no help, but I can tell you you've made a nice-looking website!

1,033 Views
Message 13 of 12
Report

Thanks for the compliment BSHDS.  

What finally worked is a "Color Block" app from the Weebly app centre, which was suggested by Weebly.

959 Views
Message 13 of 12
Report