Archived topic
how to create a shadow effect like this
7 replies · Started by Sanu Kumar on December 23, 2019
how to create a shadow effect like this in the featured image.
Hi there,
did you resolve this? As the single post featured image already has a box shadow.
I did but didn't get the same look....I need exact shadow effect
I can't give you that just by looking at an image.
You can try inspecting the site with browser dev tools and getting its CSS or use a generator to try and match it:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Background_and_Borders/Box-shadow_generator
I need CSS code which gives me a shadow effect automatically whenever I upload any image on my posts (not include featured image as it is automatically CSS shadow effect applied).
At present, I need to do it manually to add CSS in every image whenever I upload.
This is the CSS
.content-img {
border: 0px solid rgb(227, 229, 236);
box-shadow: 0px 1px 35px 1px rgba(1,10,0,0.33);
}
Use this CSS Selector:
.entry-content img {
/* CSS styles here */
}
What to do if somewhere I don't want to show the shadow effect
I would recommend adding a special class image-shadow to the images you do want the shadow and target your CSS like this:
.entry-content img.image-shadow {
/* CSS styles here */
}
Then the images without the special class won't have the shadow.