Responsive borders with CSS outline

You can use outline instead of border to achieve the same visual effect, but it’ll bleed over the edges nicely.

It’s really handy for setting borders for responsive UI where when the screen is narrow or shallow, the border is concealed.

Code language
CSS
.my-element {
outline: 3px solid #ff00ff;
}

Demo permalink