Is it better to use Inside or Outside strokes?

Can you explain why you choose one over the other? My first thought is inside to follow your own grid and spacing rules perfectly, but when it goes into development, borders are generated outside of the element, right? So should your designs be created in anticipation of that?

1 Like

I’m also interested to hear how people decide inside vs outside.

our team uses internal strokes for the same reason you mentioned: ensuring spacing isn’t influenced by a stroke.

CSS can be written this way too, so no need to compromise! Looks like developers could use the box-shadow property with inset preceding the pixel values of the shadow. An alternative would be using the outline property paired with outline-offset using a negative value.

You can see a live example of this on w3docs.