Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

SP Page Title Color Overlay on Image

Featured Lock Resolved Task
Hello,

I was looking to create a color overlay on the SP Page Title image (text was hard to read with certain images) without affecting the wave piece. I figured out how to do this and thought I'd share in the forum.

I added the following to my custom.css file


.sp-page-title:before {
content: "";
position: absolute;
background: rgba(0,0,0,0.4);
top: 0;
bottom: 0;
right: 0;
left: 0;
}

.sp-page-title .container {
z-index: 1;
position: relative;
}



Kind regards,
John

3 Answers

MW

More than a month ago #Permalink
Thank you John!

Hello,

I was looking to create a color overlay on the SP Page Title image (text was hard to read with certain images) without affecting the wave piece. I figured out how to do this and thought I'd share in the forum.

I added the following to my custom.css file


.sp-page-title:before {
content: "";
position: absolute;
background: rgba(0,0,0,0.4);
top: 0;
bottom: 0;
right: 0;
left: 0;
}

.sp-page-title .container {
z-index: 1;
position: relative;
}



Kind regards,
John


There are no replies made for this post yet.
Be one of the first to reply to this post!

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 129
Sifat

Sifat

Total Accepted Answers: 88
Toufiq

Toufiq

Total Accepted Answers: 41
Pavel

Pavel

Total Accepted Answers: 6
Al Mamun

Al Mamun

Total Accepted Answers: 3

114

Templates

292559

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us