What does .\! do in Telerik Blazor CSS?

0 Answers 46 Views
Styling
Joseph
Top achievements
Rank 1
Joseph asked on 19 Jan 2023, 12:30 AM

Working on some CSS stuff in Telerik for Blazor and see some CSS rules defined like this: 

.k-this-class {

    color: green;

}

.\!k-this-class {

   color: blue;

}

What does the .\! do in CSS?

Thanks. 

Ivan Zhekov
Telerik team
commented on 23 Jan 2023, 08:59 AM

Hello, Joseph.

The exclamation mark denotes use of !important flag in the styles. So what you should be seeing should be:

.\!k-this-class { color: blue !important }

The idea is that some times, you and any other person for that matter, shouldn't worry about specificity when using utility selectors -- you just want something to be always green, always 100% wide etc. In those cases, you can use !className.

In this very abstract example -- https://dojo.telerik.com/@joneff/oJaxIbuh -- I am showing how specificity may affect utility class names, but I am using margin-right, instead of color property.

-- Ivan

Joseph
Top achievements
Rank 1
commented on 23 Jan 2023, 08:15 PM

Thank you for the answer. While the answer didn't address my confusion directly, it did make me realize what is happening. The slash (\)  is just an escape character and is escaping the exclamation point. So thank you for that. 

No answers yet. Maybe you can help?

Tags
Styling
Asked by
Joseph
Top achievements
Rank 1
Share this question
or