Enrique
Enrique

Reputation: 4833

AJAX and CSS vs W3C (loading external content inside a div and <style>)

I'm having problems with the content loaded with AJAX inside a DIV.

I need custom CSS for the loaded content, but using <style> tag inside the div (or anywhere outside the <head>) does not respect the W3C standards. Even more, in IE8 using <style> inside the div is not working as expected.

How can we solve this situation?

Upvotes: 1

Views: 431

Answers (1)

zsalzbank
zsalzbank

Reputation: 9867

You could have the AJAX response modify the the contents of the <head> tag and add a new style tag. Your response would have two parts to it, the HTML and the CSS. The CSS should be added to the document before the HTML to ensure it is used.

Check out this post for adding CSS to the head: i prepend the css to the end of head tag

I'm assuming you have already been able to load something with AJAX into your page. Just convert your response to a JSON response with two parts, the CSS and the HTML. The JSON Spec might help too. You will need to escape any HTML or CSS that you send as a response.

Upvotes: 4

Related Questions