- This topic has 5 replies, 2 voices, and was last updated 3 years, 10 months ago by
.
Hi,
I’m looking for some CSS (or maybe an option?) within Gillion to have a kind of image border / stand out effect.
Here’s an example of what I’d like to achieve:
As you can see, there’s a kind of stand-out type effect going on where the image seems to pop out.
I know there’s a way of achieving this, I just can’t think of the right word for searching for an answer.
I’d like to set a CSS / theme option for applying this effect to all images (and YouTube videos) added on my posts/pages.
Any ideas? Thanks.
I hope you are well today and thank you for your question.
Could you please share the page URL from your site where the image and video are displaying so that I can help you to achieve it?
Best regards,
Shufflehound teamHere’s a random page on our site: https://filmlifestyle.com/how-to-start-a-production-company/
I’d like to do a sitewide change that adds the standout border/shading effect to all images and videos.
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
.post-content img, .post-content iframe { box-shadow: -2px 2px 20px 2px #afaeae; }Thanks for that.
In a similar vein, how would expand the size of each YouTube embed on a post? I’d like something that makes the YouTube video embed slightly wider than the post margins itself.
Something like the effect in the below example:
You can try achieving that using the below CSS code.
#content article iframe { width: 1050px; max-width: 1050px; position: relative; left: -19%; }
