My situation involves having a global CSS style set for text type inputs, such as:
input[type=text] {
padding:10px;
width:100px;
//and many more
}
Now, I am incorporating a plugin called colorpicker into a specific div. This plugin generates some input elements for color hex inputs and applies its own CSS styles.
.colorpicker input {
width:25px;
}
However, the existing CSS styles are conflicting with the new ones set by the plugin. I am seeking a way to reset these inputs and prevent them from inheriting any previous CSS properties. I am unsure about all the properties that may have been applied, such as borders, shadows, padding, etc. My goal is to clear all previous styles and establish a new input type. I am prepared to accomplish this using JavaScript/jQuery if necessary. I appreciate any assistance. Thank you!
EDIT: If there were a method like
$('.colorpicker input').resetCSS();