Image Shadow and Border Without Second Div?
# April 24, 2013 at 12:56 pm
What I’d like to achieve is fairly simplistic. I’d like to have an image with a 15px border and a shadow around the image. However, I’d like that shadow to be around the image itself, not outside the border.
Is this possible without an additional DIV wrapping around the image? I feel like this is a “Let me Google that for you…” question, but I’ve been unable to find an answer in searches.# April 24, 2013 at 1:08 pm
> Is this possible without an additional DIV wrapping around the image?
No, it’s not possible (for now). At least, as far as I know, maybe someone has something creative up their sleeve. But I’d say your best bet without extra markup would be a pseudo-element, which isn’t (currently) supported for the `img` tag. See [this spec](http://www.w3.org/TR/CSS2/generate.html#before-after-content “”).# April 24, 2013 at 1:49 pm
Can’t do it with only the image element as you can’t have pseudo elements for it.
But this you can do:
box-shadow: inset 0 0 1em black;
It might not be what you want, but it works.# April 25, 2013 at 2:58 pm
This reply has been reported for inappropriate content.
Thanks everybody, there’s a lot of great solutions here – I’m using @CrocoDillon ‘s.
A definite issue with CSS is that some things aren’t well-documented and it takes creative thinking to get the desired results. Very well done.
You must be logged in to reply to this topic.