[SOLVED] Cannot hide compatibility button using html5boilerplate

Cannot hide compatibility button using html5boilerplate

I've gone through lots of questions on stackoverflow but I can't get this to work.

I am using html5boilerplate with a little bit of WP PHP on top of it and I am wondering if that could be the reason why I am not able to hide the compatibilty button in IE? Or am I getting it all wrong and the <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> does not work that way?

Here is the HTML that supposedly goes out first:

<?php
/**
 * The Header for our theme.
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package WordPress
 * @subpackage Twenty_Ten
 * @since Twenty Ten 1.0
 */
?><!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

Any ideas? TY...

Solution

You should review the related Github issue https://github.com/h5bp/html5-boilerplate/issues/378

Seems that you need to move the location of the tag to before the IE Conditional Comments

<!doctype html>
<html lang="en">
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <!--[if lt IE 9]><html class="oldie"><![endif]-->
        <meta charset="utf-8">
        <title>Document</title>
    </head>
    <body>
    </body>
</html>