Question:
How can I make a disabled button have the not-allowed
cursor? I tried using button:disabled
but it didn’t seem to work.
Code snippet:
button:disabled {
cursor: not-allowed;
}
Repl link:
https://replit.com/@RotoBit-Studios/RotoBit-Studios
OK so I tried it in the W3Schools editor and it seemed to work fine, I think the problem is cause I’m using replit.css
by hecker40.
Edit: I just used the style
attribute to change the cursor (don’t bulli me trash at js):
const disabledButtons = document.querySelectorAll('button:disabled');
disabledButtons.forEach(button => button.style.cursor = "not-allowed");
1 Like
Instead of using js, have you tried adding !important?
button:disabled {
cursor: not-allowed !important;
}
2 Likes
Thank you this will help me
1 Like
Thanks, that worked. But I thought using !important
was considered bad practice?
It probably is, I just think it’s better to have your css all together
1 Like