IE9 doesn't allow dynamic style with PHP and c

Question

My plugin adds dynamic CSS to the frontpage:

function form_css() {
    header( 'Content-Type: text/css' );
    header( 'Expires: Thu, 31 Dec 2050 23:59:59 GMT' );
    header( 'Pragma: cache' );

    if ( false === ( $css = get_transient( 'mymail_form_css' ) ) ) {
        // generate CSS here
        set_transient( 'mymail_form_css', $css );
    }

    echo $css;
    die();
}

add two action hooks:

add_action('wp_ajax_my_css', 'form_css');
add_action('wp_ajax_nopriv_my_css', 'form_css');

and enqueue the style:

wp_register_style('my-css', admin_url('admin-ajax.php?action=my_css'));
wp_enqueue_style('my-css');

This works perfectly on all browsers (including IE7+8) except on IE9.

I've searched for this issue and found about the X-Content-Type-Options: nosniff header but adding header( 'X-Content-Type-Options: nosniff' )doesn't solve the problem.

Any help is kindly appreciated

Answer 1

A simpler answer it for force IE9 into "Compatibility view".

More reading on why at http://blogs.msdn.com/b/ieinternals/archive/2011/03/27/http-406-not-acceptable-php-ie9-standards-mode-accepts-only-text_2f00_css-for-stylesheets.aspx - but tldr is that Microsoft are stricter in what they accept as a style sheet to help improve security.

Internet Explorer 9 users can workaround the site’s bug by putting the site into Compatibility View. In Compatibility View, IE reverts to its legacy behavior of claiming to accept any MIME type for subdownload requests, and the server returns the response without complaint.

You can change the mode with

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" >

or if that stil fails, drop to IE8

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

or

<meta http-equiv="X-UA-Compatible" content="IE=IE8" >

Put that in the HTML header - will only affect IE.

Answer 2

I don't know if this helps somebody. At least for me it does:

WordPress wraps p tags around my shortcodes and since I'm using block elements in my form (and shortcode) I've and block element inside a block element - which isn't allowed.

Removing the surrounded p's solves the problem.

Edit: Use the Shortcode empty paragraph fix to remove the p's

Answer 3

i guess your css is a php file? something like style.css.php?

http://blog.s9y.org/archives/227-IE9-has-trouble-with-CSS-Content-Types.html - maybe this can help you.....

mod_negotiate would basically properly execute the PHP file and return valid CSS