SVG Text Mask
hello there i wanted to use a mask for my title but mask is kinda heavy like 450kb, when i use it for text mu whole website becomes laggy, perhaps is there any better way to apply mask for text (i'll use it for dynamic pages so i cant just export it like an image) i can also send a mask if that'll help
```html
<h1 class="font-[Akshar] leading-none bg-clip-text text-primary-900 bg-transparent
[-webkit-mask:url(/img/font-pattern.svg)_repeat_10%_70%] [mask:url(/img/font-pattern.svg)_repeat_10%_70%] whitespace-nowrap z-10"...
Can we modify user agent default styling?
Hello, I wanted to create a horizontal line (see the picture... it's not that visible though sorry :c).
I wanted to set an outer container wrapping both the wordings
My Profile , then use display flex thinking that when I will use the hr element, the line will be just beside My Profile and it will be like in the picture. But I didn't get this effect at all :c.
The line when used being a child of a flex container seems to have "disappear" but it's still present in the DOM. I tried to change its color but no change....
Is a true pure-CSS XOR blend mode possible in 2025?
As an old assembly-language guy, I think about the math in blend modes.
And I was looking at today's CSS Battle Daily and thought it would be really easy and clever if I could toggle between foreground/background colors, by using the XOR of the two values.
But mix-blend "exclusion" isn't really XOR and "difference" only works in one direction. It's not reversible like XOR.
Just something I ponder over about once a year. 😸 ...
Can't login to https://learn.kevinpowell.co/
I have tried enrolling three times. But everytime I click dashboard it sends me back to the login page and then it says that my account doesn't exist?!
Please help...
why I'm getting this behaviour?
Targeting all labels with this in css
label{margin-bottom:.5em} affects only the first two labels(first & last name) and ignores the email label, why it happens
my html goes like:
` <form>
<div class="first-row">...
Why is there a flex gap around the first and last item in a wrapped row?
I have a flex row 1rem gap justify content flex-start, when wrapping it ends up being three rows. When it doesn't wrap, the first and last items are at the edges and there's a 1rem gap between columns and everything's fine. But when the row wraps, suddenly the first and last items are not at the edges - they have the 1rem gap around both sides of them. If I take out the gap while wrapping, it's also fine and aligns properly. But when wrapped, there's this noticeable gap at the front! Any ide...
