Transparent gap between border and background

Hello, I would like to introduce a transparent Gap between my Box Shadow and the actual contents of which are text.

http://165.227.81.224/spring-collection/

Where it says Spring collection. I have white transparent at around 85%. The outer Box Shadow is set too white. I would like to introduce a fully transparent gap between the transparent white and the full white box shadow.

Hi There,

Please change the box-shadow CSS to this:

box-shadow: 0em 0em 0px 0.1em hsla(0, 0%, 100%, 0.2);

Hope it helps :slight_smile:

@thai

Thank you for the quick response. Sorry, I should have created something real quick in Photoshop. I was thinking something more along the lines of this.

Hello @scuur,

Please add following CSS as well and see how it goes:

border: 1px solid #fff;
    width: 100% !important;

Thanks.

thank you I figured it out.

Code if anyone ever needs it.

$el {
border: solid .1em rgba(0, 0, 0, 0.0);
padding: .5em;
background: #e18728 content-box;
}

Glad to hear you got it sorted.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.