Сетки Purecss не работают должным образом

Question

Я использую документацию по адресу http://purecss.io/grids/ и в основном копирую пример кода, чтобы создать сетку из третей

<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>

Однако это просто не отображается, как объясняется в документации - как 3 столбца равных третей: http://jsfiddle.net/a7rnzn5f/1/

Что я не понимаю?

Answer 1

Вероятно, у вас нет ссылки на отзывчивую часть чистых сеток.

По предоставленной вами ссылке:

Поскольку медиазапросы не могут быть перезаписаны, мы не включаем систему сетки в состав pure.css. Вы должны будете извлечь его как отдельный файл CSS. Вы можете сделать это, добавив следующий тег на свою страницу.

<!--[if lte IE 8]>
    <link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/grids-responsive-old-ie-min.css">
<![endif]-->
<!--[if gt IE 8]><!-->
    <link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/grids-responsive-min.css">
<!--<![endif]-->

Добавьте это, и у вас все получится!

РЕДАКТИРОВАТЬ: Извините, я не заметил вашу скрипку. Похоже, вы сделали только обратное. Не похоже, что вы включили базовую ссылку на purecss. Я обновил вашу скрипку по ссылке ниже, и она, кажется, работает.

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">