2015-11-25 2 views
1

У меня есть следующая страница, которая отображается правильно с TOP BAR, снимая все верхнее пространство и 3 других divs, отображаемых рядом друг с другом под ним.Почему сетка Bootstrap стекает свои столбцы в Chrome?

Однако на Chrome он складывает все друг на друга независимо от размера браузера. Есть идеи?

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Whatever</title> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous"> 

</head> 
<body> 
    <h1>Hello!</h1> 

    <div class="container"> 
     <div class="row"> 
     <div class="col-xs-12"> 
      TOP BAR 
     </div> 
     </div> 
     <div class="row"> 
     <div class="col-sm-4"> 
      I am left 
     </div> 
     <div class="col-sm-4"> 
      I am center 
     </div> 
     <div class="col-sm-4"> 
      I am right 
     </div> 
     </div> 
    </div> 

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script> 
</body> 
</html> 

Для того, чтобы воспроизвести это, пожалуйста, ссылку на начальной загрузки файлов с помощью integrity ограничения.

+2

Я не могу воссоздать это. Колонки выравниваются правильно в обоих браузерах: http://www.bootply.com/mkzEpx8Ey5 –

+1

Кажется, что это прекрасно работает в [этой ручке] (http://codepen.io/anon/pen/gaNpGq). Вы проверили консоль своего браузера на наличие ошибок и гарантировали, что страница не кэширована. –

+0

Это не ваша проблема, но вам не хватает jQuery, который является требованием Bootstrap. – DavidG

ответ

1

Благодаря Jdsfighter «s комментарий после открытия console я увидел следующие ошибки:

Не удалось найти правильный дайджеста в„целостности“атрибут для ресурса » https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css ' с вычисленным SHA- 256 целостность '7s5uDGW3AHqw6xtJmNNtr + OBRJUlgkNJEo78P4b0yRw ='. Ресурс заблокирован .

Не удалось найти правильный дайджест в атрибуте 'целостности' для ресурса 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js' с вычисленным SHA-256 целостности 'KXn5puMvxCw + dAYznun + drMdG1IFl3agK0p/pqT9KAo ='. Ресурс заблокирован .

По какой-то причине проверка целостности не работала в моем экземпляре Chrome, и в результате мне пришлось удалить их.

+1

Вероятно, он работал в браузерах, которые не реализуют атрибут 'integrity'. – DavidG

+0

Да, это объяснило бы. – MaYaN

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