I am facing an issue in my application where I am using global CSS definitions for "INPUT", "SELECT", and other elements. The problem arises when I try to incorporate KendoUI widgets, as they override my default CSS styles.
For instance, my CSS code looks like this:
.m-forms SELECT,
.m-forms TEXTAREA,
.m-forms INPUT[type=text] {
...
}
I attempted to solve the problem by modifying the CSS as follows:
.m-forms :not([class^="k-widget"]) SELECT,
.m-forms :not([class^="k-widget"]) TEXTAREA,
.m-forms :not([class^="k-widget"]) INPUT[type=text] {
...
}
However, this solution did not work. How can I disable my default styles in KendoUI widgets? Here is a snapshot of my example DOM tree: my page source code