Thunder
KPCKevin Powell - Community
•Created by Thunder on 2/2/2024 in #front-end
border-radius on a border-image with linear-gradient
Solution that worked for me without all the extra border/margin stuff in the example:
.card-border-13px {
border-radius: 13px;
&.card-green-gold-border {
border: 2px solid transparent;
background: linear-gradient(#fff 0 0) padding-box, linear-gradient(90deg, green, gold) border-box;
}
}
9 replies
KPCKevin Powell - Community
•Created by Thunder on 2/2/2024 in #front-end
border-radius on a border-image with linear-gradient
@z- ::theProblemSolver:: How do I mark this one solved? 🙂
9 replies
KPCKevin Powell - Community
•Created by Thunder on 2/2/2024 in #front-end
border-radius on a border-image with linear-gradient
You are awesome!
9 replies
KPCKevin Powell - Community
•Created by Thunder on 2/2/2024 in #front-end
border-radius on a border-image with linear-gradient
CSS from the browser 🙂
.card-border-13px.card-green-gold-border {
border: 2px solid;
border-image: linear-gradient(90deg, green, gold);
border-image-slice: 1;
}
.card-border-13px {
border-radius: 13px;
box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.45);
}
9 replies