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,957 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,948 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,945 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,917 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,904 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,899 Views
Message 6 of 12
Report

Np, in the code you gave change this:

background: #404040;

to this:

background: none;
4,810 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,805 Views
Message 8 of 12
Report

@Phillip

Try using a color block, instead of a section!

4,227 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,197 Views
Message 11 of 12
Report

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

1,076 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.

1,002 Views
Message 13 of 12
Report