DOM created content in IE not respecting stylesheet

[Sebarry]

Hi,

I've got a Javascript function to create some DOM content. The content is created fine in both IE and FireFox except that it FireFox it has styled the content according to the linked stylesheet, but in IE it has not.

Any ideas?

Regards,

Sean

[drhowarddrfine]

Without a link or the complete code, anything we say would be just a wild guess.

[acoder]

You posted this in the Articles section. Moved to the Forum section.

[Sebarry]

It's a bit difficult to supply the code as it's being developed internally. The code works fine on Firefox but in IE its not using the stylesheet. If I copied everything that has been generated, the generated source of the document into another HTML page it renders fine. So no changes to the code result in a perfect page when it is created in advance. It's only when the same content is created using the DOM that it doesn't render properly.

Without a link or the complete code, anything we say would be just a wild guess.

[acoder]

Can you give some of the style rules that are not applied (or is it every rule)?

[Sebarry]

Hi,

This is the class that is used by the text that is not being styled.

.black11pxplain {
    font-family:Arial, Helvetica, sans-serif;
    font-size:11px;
    line-height:14px;
    color:#000000;
    text-align:left;
}
 

It's included from an external file:

<link href="includes/main_styles.css" rel="stylesheet" type="text/css" />

And it's used as follows:

<td height="25" valign="middle" class="black11pxplain">Sub Heading</td>
 

What's frustrating is that the HTML page is a mixture of static and dynamic content. The static content is rendered fine, it's the dynamic content that's not rendered according to the stylesheet. I've tried linking the stylesheet at runtime and again the static content gets rendered according to the stylesheet. I thought maybe it was not reapplying the stylesheet to what had been created at runtime using the DOM.

I'm lost.

Can you give some of the style rules that are not applied (or is it every rule)?

[deuce789]

Are you setting classes using setAttribute?

If so you need to use setAttribute("classname", "name_of_class");
In internet explorer and setAttribute("class", "name_of_class"); for all the other web browsers