SKT Corp Pro Theme – Transparent Darker Box Behind Slider Title and Description

[bigcountrykevin]

The title and description on my slider image blend in with some of the colors in my slider image making it difficult to read. Is there a way to make a transparent darker box behind my slider title and description?

[Sonnal S Sinha]

Hi,

Kindly show us your website URL please?

Regards,
Dave

[bigcountrykevin]

Sorry about not including that.
https://www.uniteddisinfectant.com/

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

.layout_wide .nivo-caption {
    background-color: rgba(0,0,0,0.5);
    padding: 20px;
}

Regards,
Dave

[bigcountrykevin]

That’s perfect.. couple other issues.
When on mobile, the slider photos are not as tall leaving the title missing half of the letters.
Also, you will see the green bars Ive added with the call to actions, they wrap instead of condense. How do I fix those issues?

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

@media screen and (max-width:479px) {
.nivoSlider img { max-width:140% !important; width:140% !important; margin-left:-40%;}
.buy_theme h2 a { padding: 10px; font-size: 15px;}
}

Regards,
Dave

[bigcountrykevin]

The code that you provided fixed the issue I had for “the green bars Ive added with the call to actions, they wrap instead of condense.” – Thank you!

It did not fix the issue with the slider.
I will rephrase the problem. When on mobile only, the top of the slider image and the title for the slider are cut off.

Maybe reducing the size of the title font while on mobile will help? Just thinking out loud, you’re the pro!

[Sonnal S Sinha]

Hi,

Remove CSS

@media screen and (max-width:479px) {
.nivoSlider img { max-width:140% !important; width:140% !important; margin-left:-40%;}
.buy_theme h2 a { padding: 10px; font-size: 15px;}
}

Add this new CSS there

@media screen and (max-width:479px) {
.nivo-caption { height:auto !important;}
.nivoSlider img { max-width:140% !important; width:140% !important; margin-left:-40%;}
.buy_theme h2 a { padding: 10px; font-size: 15px;}
}

Regards,
Dave

[bigcountrykevin]

Thank you for your time!

[Sonnal S Sinha]

Hi,

If you found our service good kindly review us here: https://www.sktthemes.org/forums/topic/reviews-and-testimonials/page/25/

Regards,
Dave

[Author]

Posts