Search Issue Tracker
By Design
Votes
0
Found in
2021.3.36f1
2022.3.21f1
2023.2.13f1
2023.3.0b10
Issue ID
UUM-65467
Regression
No
Button’s color doesn’t change when using a StyleSheet with “Button” and “.btn:hover” classes
How to reproduce:
1. Open the user’s attached “ui bug example.zip” project
2. Enter Play Mode
3. Move the cursor over the buttons
Expected result: Both buttons are red when hovered becomes blue
Actual result: One button is grey, and the other is red, when hovered nothing is happening
Reproducible with: 2021.3.36f1, 2022.3.21f1, 2023.2.13f1, 2023.3.0b10
Reproduced on: macOS 14.2.1 (Intel)
Not reproducible on: No other environment tested
Notes:
- after adding StyleSheet to UI Builder, the issue still exists
- the Styling just for the "Button" itself doesn't work at all. The styling for the .btn class gets applied but the styling for the ".btn:hover" isn't
Add comment
All about bugs
View bugs we have successfully reproduced, and vote for the bugs you want to see fixed most urgently.
Latest issues
- Non-multisampled texture binding errors are logged when running the DepthBlit URP scene with MSAA enabled on Vulkan
- The Editor does not recognize code errors in generic classes when using C# Source Generator to generate serialization code
- NullReferenceException is logged when undoing Deletion of a Visual Query Block of a Search Expression
- “Unsupported type MinMaxCurve” error and “Could not register property modification for animation binding…” warnings are thrown after moving playhead when Particle System Property is added to Animation window
- Nested LocalizedStrings can not query local variables
Resolution Note:
Unfortunately, that's the way selector specificity works and Unity's style have a certain level of specificity that needs to be accounted for. C# class names are less specific than .class-names, and Unity's stylesheets uses `.unity-button` on its buttons. That's why `.btn` is applied, but not `Button`.
As for the hover state, same reason. Unity button has a `.unity-button:enabled:hover` selector, which is more specific than `.btn:hover`. It would need to be `.btn:enabled:hover`.
The UI Debugger can be used to inspect these selectors and sort out the specificity needed.