• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 939
  • Last Modified:

IE 6 and the CSS dot notation

I have this code:

CSS
---
p {color:#583000; font-family:arial; font-size:14pt}
p.italic {color:black; font-family:arial; font-style:italic; font-size:10pt;}

JavaScript
----------
function test(theId){
  oInp = document.getElementById(theId);

  pItal = document.createElement("p");
  pItal.setAttribute("class","italic");
  oInp.parentNode.replaceChild(pItal, oInp);
       
  text = 'Just A Test';
  textNode = document.createTextNode(text);
  pItal.appendChild(textNode);
}

HTML
----
<form>
 <input type="text" name="textName" onBlur="test('x')" id="x">
</form>

In NN 6 this works fine, the text is displayed using the "p.italic" style. In IE 6 the text is displayed using the "p" style, not the "p.italic" as intended. I can't tell you how annoyed I am. I'm trying to avoid having two separate CSS's. Why doesn't IE recognize the CSS dot notation? I even checked that IE wasn't ignoring the setAttribute method using:

alert(pItal.getAttribute("class"));

and both browsers returned

italic

although IE isn't actually using the "p.italic" style. Short of having to set each individual "p.italic" attribute using JavaScript, what can I do to get IE to cooperate?

bmh
0
bmh777
Asked:
bmh777
  • 2
  • 2
1 Solution
 
BChanCommented:
replace
 pItal.setAttribute("class","italic");
with
 pItal.setAttribute("className","italic");

BChan
0
 
bmh777Author Commented:
Thanks for the answer. I actually found the answer myself shortly after posting this question and was in the process of trying retract it. Please accept my apologies.

bmh
0
 
bmh777Author Commented:
That should be, "trying to retract it."
0
 
BChanCommented:
bmh777 ,
no problem, happy coding!
BChan
0
 
NetminderCommented:
Points refunded and question closed; user resolved.

Netminder
EE Admin
0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now