in this case, you don't need mask or pseudo element simply do
.box { border:8px solid #0000; border-radius:10px; background: linear-gradient(red,blue) padding-box, linear-gradient(green,pink) border-box; }
thanks for the tip, will try.. my designer made this, at first i tried it with a border-image-source but it doesn't work with border-radius, of course
Well i tried what you said, but it looks very much differently from what i want to archive and it's so sad.
PS: i decided simply to export the background with border as a background (svg), the simplest way
Thus just saved me more digging, thanks muchacho
This is SO much cleaner than all the "gradient border"-articles you find around the web — love the 4-char alpha-hex. Thank You!
Perfect. This solves.
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink.
Hide child comments as well
Confirm
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
in this case, you don't need mask or pseudo element simply do
thanks for the tip, will try.. my designer made this, at first i tried it with a border-image-source but it doesn't work with border-radius, of course
Well i tried what you said, but it looks very much differently from what i want to archive and it's so sad.
PS: i decided simply to export the background with border as a background (svg), the simplest way
Thus just saved me more digging, thanks muchacho
This is SO much cleaner than all the "gradient border"-articles you find around the web — love the 4-char alpha-hex. Thank You!
Perfect. This solves.