Docs

[festifly-admin]

Hello again,

So I have my revolution slider set up with the hero slide. I uploaded and inserted an image using the revolution slider tab within WP. the images look fine at 100% opacity when I insert them- however, when I view the site, the image has a black transparent overlay on it.

I can’t figure out where these overlays are coming from. Is this a setting within the revolution slider tab I’m missing? Or somewhere else? I just want them to appear as 100% opacity. I may want to target these with custom CSS at some point, so if you could tell me what item to target that would help as well.

You can take a look using my provided info. The hero is the second thing you’ll see when you preview the page (a girl wearing white pointing at a video). Thanks

[festifly-admin]

This reply has been marked as private.

[Nabeel A]

Hi there,

Thanks for writing in! Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.rev_slider .slotholder:after {
    background: transparent !important;
}

Let us know how this goes!

[festifly-admin]

I’m sorry but when I entered that code no change took place.
Is there another avenue we can take?

[Rad]

Hi there,

You have existing CSS that has no proper closing bracket.

@media (min-width:767px){
.blog .entry-featured {
    float: left;
    width: 38%;
margin:2%;
}
.blog .entry-content.content p {
    width: 60%;
    float: right;

.x-flexslider.x-post-slider {
    width: 74%;
  	float: left;
    margin-right: auto;
    margin-left: auto;
}
.archive .x-header-landmark {
    display: none;
}
.rev_slider .slotholder:after {
    background: transparent !important;
}

@media should have proper closing, though, I’m not sure what CSS are belong to that @media (min-width:767px) {} block

And .blog .entry-content.content p should be properly closed too, it should be like this

.blog .entry-content.content p {
    width: 60%;
    float: right;
} /* closing here */
.x-flexslider.x-post-slider {
    width: 74%;
  	float: left;
    margin-right: auto;
    margin-left: auto;
}

Any incorrect declaration of CSS will invalidate all other CSS under it.

Thanks!

[festifly-admin]

Thank you that worked, I can’t believe I missed that. Thanks again…

[Nabeel A]

Glad it worked 🙂

Cheers!

[festifly-admin]

Awe Man, the code negated the CSS opacity setting I had originally set for other slides on my site.

That’s a Bummer, is there any way to make sure the CSS I set in place for the overlay on previous slides doesn’t affect other or future slides, and vice versa?

[Rad]

Hi there,

If it’s specific to a page and slide, then it should be like this

.page-id-155 #rev_slider_11_2_wrapper .slotholder:after {
    background: transparent !important;
}

Thanks!

[festifly-admin]

That did the trick. Thank you again!

[Nico]

Happy to hear that.

Feel free to ask us again.

Thanks.

[Author]

Posts