Remove opaque block from slider
-
Hi, I would like to completely remove the semi-opaque background block behind the text in my slider. I’m using the Prosperity theme. I went into inspect element and, (I know zero about CSS), but the two things that *seem* to need removing/changing show up as:
div.container: :before 0x0
and the little image that looks like a folded page corner (bottom right of block):
div.inner-hentry: :after 30×30
I could be mistaken about that ^^ but I fiddled around in the inspect elements (Chrome) and I was able to make everything disappear just the way I’d like it, but can’t save it in the inspect elements.
I would *greatly* appreciate assistance with this. Have been trying to do it myself for several hours today and yesterday.
The blog I need help with is: (visible only to logged in users)
-
To completely remove this semi-opaque black background you can change this CSS class:
#featured-content .featured-slide .hentry.has-post-thumbnail .inner-hentry:before {
opacity: .8;
}This item opacity is set as 0.8 but you can add this class on Customizer > CSS and change it to 0 (transparent) or 1 (no opacity).
-
Thank you so much, and that has *almost* solved the whole problem. There’s just that little square
div.inner-hentry: :after 30×30
which is still visible! Can you tell me how to remove it? Thank you so much!
-
I have changed one of the images to plain pastel so the little square is really easy to spot.
-
Oh, there is a border on this item, I didn’t saw it with a dark image on background.. We can remove it using this CSS:
#featured-content .featured-slide .hentry .inner-hentry:after{
border:none;
} -
YAY! You are my absolute hero! Yes, the images I’d chosen were dark which made it difficult to see the border, which is why I changed one to a beige colour you could see it more easily. You are amazing at your job; I am so grateful! :-)
- The topic ‘Remove opaque block from slider’ is closed to new replies.