Border "padding"?
Hello everyone, with a div that has padding-inline, how do you typically styling to achieve a border like this image?
I usually add border to pseudo-element like ::after or to a child div instead, just wondering if there is a better way...
3 Replies
you could do it with a border image.
If you make the inline-padding a custom property, you could use that value to calculate a gradient (transparent, color, transparent) for the border-image.
something like this:
https://codepen.io/MarkBoots/pen/rNPzqQg
cool, thank you so much 😁 I always forget that border-image exists
Removed the codepen. Here a backup for future reference