2013-12-12 4 views
2

Я создал свой сайт в качестве детской темы с двадцатьнадцатого, Wordpress. У меня встроенный Bootstrap, и все работает нормально. За исключением IE8. Страница застряла в мобильном режиме все время.Bootstrap отзывчивость не работает в ie8 на сайте wordpress

Я выполнил инструкции на странице Bootstraps и включил response.js в свой заголовок после моего CSS. Я также включил html5shiv. Но он все тот же, страница составляет 100% ширины и всего одного столбца.

Я также попытался установить http-equiv на x-ua-совместимый. Моя голова-тег выглядит следующим образом:

<head> 
    <meta charset="<?php bloginfo('charset'); ?>"> 
    <meta name="viewport" content="width=device-width"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title><?php wp_title('|', true, 'right'); ?></title> 
    <link rel="profile" href="http://gmpg.org/xfn/11"> 
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>"> 

    <?php wp_head(); ?> 

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> 
    <!--[if lt IE 9]> 
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
     <script src="<?php echo get_stylesheet_directory_uri(); ?>/js/respond.min.js"></script> 
    <![endif]--> 
</head> 

И мои МЕНЬШЕ стили начинаются так:

Я знаю, что ответить не работает на CSS импортированного с @import, но CSS в первом импортном Безразлично 't нужно манипулировать response.js, а Bootstrap-import - LESS import, и поэтому полученный CSS имеет всю загрузку вместе с моей собственной в том же файле.

/* 
Theme Name:  Public Web 
Description: Public Web theme, responsive and HTML5 compatible 
Author:   Me 
Author URI:  http://stinaq.me 
Template:  twentythirteen 
Version:  1.0.0 
*/ 

@import url("../twentythirteen/style.css"); 
@import "bootstrap/bootstrap-min.less"; 

Я попытался как Минимизированная версией Bootstrap, а также регулярной и как IE (из режима совместимости и реальный IE8. В respond.js найден в браузере, так что не может быть . это либо

EDIT:

Я бег сайта на локальный XAMPP-сервере и поэтому не пытаюсь получить доступ к respond.js через // файл, а локальный

+0

Как насчет добавления 'intial-scale = 1.0' в метатег viewport? ты это пробовал? поэтому ' ' – Bobby

+0

Пробовал это сейчас, но это не помогло – stinaq

+0

Я всегда проверяю журналы сервера на любом сайте, который я пытаюсь чтобы выполнить тестирование совместимости, как это происходит. Обычно это пустая трата времени, потому что у вас нет посетителей, использующих IE8. Проверьте это и сэкономьте некоторое время. –

ответ

0

It похоже на эрро r было чем-то совершенно другим. Раньше у меня была другая проблема, связанная с тем, что html не отображается правильно в инспекторе. Когда я снова создал файлы с нуля, он неожиданно сработал. В то время я создал файлы, используя Sublime вместо Visual Studio, поэтому кажется, что кодировка была неправильной. Подробнее: https://wordpress.stackexchange.com/users/43535/squ

3

У меня была аналогичная проблема с бутстрапом 3, используемым в wordpress. Он отлично работал во всех браузерах, кроме IE8 и ниже. Медиа-запрос больше не работал. Сегодня я понял, что произошло. Это была эмблема @import. Я включил все файлы CSS непосредственно в заголовочный файл, как это.

Код:

<link href="<?php bloginfo('template_url');?>/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

Сейчас он работает нормально.

Смежные вопросы