PDA

View Full Version : CSS.UpdateRule and Capitilization of selectors/class names



willgillen
4 Sep 2009, 8:51 AM
I ran into an interesting problem, and I'm hoping someone in the forums can help clarify this strange behavior (or point out my ignorance? :) )

I am using Ext.util.CSS.updateRule() to change some CSS attributes as follows. However, I am using this to change behavior of some of my own custom class names.

For instance, I have a class in a .css file as follows:


.NormalTextBox
{
background-color:yellow;
}


And, I originally tried to use .updateRule() as follows:


Ext.util.CSS.updateRule('.NormalTextBox','background-color','red');


And, it didn't work. Then, after some trial/error/experimenting, I found that this DOES work?:


Ext.util.CSS.updateRule('.normaltextbox','background-color','red');


You'll notice that the method .updateRule() only seems to work in this case when the selector is ONLY lowercase. Why is that? Am I not suppose to use MixedCase CSS class names?

Thanks for any feedback.

-- Will G.

willgillen
4 Sep 2009, 9:00 AM
Okay, here's an update which makes this stranger...
In Safari and Chrome, the selector with ".NormalTextBox" does NOT work, but ".normaltextbox" DOES work.
But, in FireFox, the selector with ".NormalTextBox" DOES work, but ".normaltextbox" does NOT work.

So, what to do now?

willgillen
4 Sep 2009, 10:28 AM
Well, I figured out *how* to do it, but not pretty:


Ext.util.CSS.updateRule(['.normaltextbox','.NormalTextBox'],'background-color','red');