mozilla changes cssText

[Garrett Smith]

This is what goes in to my styleSheet:
[code:8z6mmdqzdg]
td.td3 {
font-size: 13px;
font-family: arial;

border-style: solid;
border-width: 1px;

border-top: thin solid #ffcc33;
border-right: thin solid #ffcc33;
border-bottom: thin solid #ffcc33;
border-left: thick solid #ff4c33;

font-weight: 400;
font-style: normal;
width: 15%;
color: #112244;
}
[/code:8z6mmdqzdg]

This is what mozilla says is in the cssText (line breaks mine):
[code:8z6mmdqzdg]td.td3 {
border-style: solid;
border-color: rgb(255, 204, 51) rgb(255, 204, 51) rgb(255, 204, 51) rgb(255, 76, 51);
border-width: thin thin thin thick;
font-size: 13px; font-family: arial;
font-weight: 400;
font-style: normal; width: 15%;
color: rgb(17, 34, 68);
}[/code:8z6mmdqzdg]

Weirdly annoying!






http://dhtmlkitchen.com/ - The best DHTML website!

[Chris]

a class of td3? thats the most confusing naming ever i think :P

as for the problem in hand.. what do other browsers return for colors? rgb values also?

[url="http://chrispoole.com"]Chris[/url:6jsj7rnma5]

[Garrett Smith]

I need to test more, IE, as far as I know, will give you what you give it. This is desired.[code:27dulidaid].td3 { flavor: cherry; }[/code:27dulidaid]I think you'll get this in IE, but I have to test more. I know IE doesn't change to rgb values. IE always gives me what I give it, so far.

Right, they don't use col selectors here, just using a number after td. Anyway...


http://dhtmlkitchen.com/ - The best DHTML website!

[Mark]

Mozilla represents colors as rgb internally. And cssText gives a text version of the computed style for that node, which is the internal style.

But yeah, I see your point. Some consistency, please!

- [url="http://neo.dzygn.com/"]Mark[/url:npdtcz73zj]

[Garrett Smith]

Let's say an example of: [code:j54coa5bxf]
.td3{
border-right: 2px solid #FAA43A;
}[/code:j54coa5bxf]


alert(styleSheet.cssRules[0].style.borderTop), mozilla gives you:

"0pt none -moz-user-text-color"

This is bad because I want to see if a property is defined in the styleSheet.

So I guess I have to do some special handling for Mozilla.

Anyway, here's a bookmarklet where you can check out the cssText of any styleSheet.
-> javascript:alert((function getStyleSheetText(styleSheet) { var cssRuleList = styleSheet.cssRules||styleSheet.rules; var len = cssRuleList.length; var styleSheetTextList = new Array(len); for(var i=0;i<len;i++){var rule=cssRuleList[i:j54coa5bxf]; styleSheetTextList[i:j54coa5bxf] = rule.cssText;} return styleSheetTextList.join("\n");})(document.styleShe ets[eval(prompt("enter the number (0 based) of the stylesheet you want to see: "))]))

http://dhtmlkitchen.com/ - The best DHTML website!

[Garrett Smith]

Better use a new window. just copy-paste to location bar.

javascript:void(x = window.open()); void( x.document.write("<plaintext>"+ (function getStyleSheetText(styleSheet) { var cssRuleList = styleSheet.cssRules||styleSheet.rules; var len = cssRuleList.length; var styleSheetTextList = new Array(len); for(var i=0;i<len;i++){var rule=cssRuleList[i:fylst8b7hu]; styleSheetTextList[i:fylst8b7hu] = rule.cssText;} return styleSheetTextList.join("\n");})(document.styleShe ets[eval(prompt("enter the number (0 based) of the stylesheet you want to see: "))])));void(x.document.close());

http://dhtmlkitchen.com/ - The best DHTML website!