Тесты: Grid

Данная страница является демонстрационной. Документацию по компоненту «Grid» можно найти здесь.

Clearfix method test for not colapsing margin. (Safari)
Float Test
1-2
1-2
M-1-2
M-1-2
L-1-2
L-1-2

Grid Nested

1-2
1-2
1-2
M-1-2
M-1-2
M-1-2
L-1-2
L-1-2
L-1-2

Grid Combined

Использование классов uk-visible-* и uk-hidden-*.

M-1-2 L-1-3
hidden-medium
M-1-2 L-1-3
1-2 M-1-3
hidden-small
1-2 M-1-3
1-1 visible-small
M-1-1 visible-medium
L-1-1 visible-large
1-1 hidden-large
L-1-2
L-1-2

Push/Pull

Работает только с uk-width-medium-*

Первый
В конце

Более сложные варианты

Это простой многострочный текст для тестирования.
M-1-4
M-1-4
M-1-3
M-1-3
M-1-3
M-1-3
M-1-3
M-1-4
M-1-4
M-1-4
M-1-4
1-2
1-2
1-2
1-2

Какой-то параграф

Еще какой-то абзац

M-1-2
M-1-2
Panel
Panel
Panel
Panel
Panel
Panel
Panel
Panel
1-4
1-4
1-4
1-4
1-4
3-4
1-2

Multi-row

Эта grid-сетка содержит несколько блоков, которые размещаются в несколько строк (multiple rows).

Обычная пиксельная ширина


Even widths


Без зазоров - Collapse gutter

1-2
1-2
M-1-2
M-1-2
L-1-2
L-1-2

Маленький зазор - Small gutter

1-2
1-2
M-1-2
M-1-2
L-1-2
L-1-2

Средний зазор - Medium gutter

1-2
1-2
M-1-2
M-1-2
L-1-2
L-1-2

Большой зазор - Large gutter

1-2
1-2
M-1-2
M-1-2
L-1-2
L-1-2

Разделитель - Divider

1-2
1-2
1-2

M-1-2
M-1-2
M-1-2

L-1-2
L-1-2
L-1-2

M-1-2 L-1-3
hidden-medium
M-1-2 L-1-3

1-2 M-1-3
hidden-small
1-2 M-1-3

100 visible-small
M-1-1 visible-medium
L-1-1 visible-large

Автоподбор высоты столбцов/колонок - Auto-match column heights

По дороге встретил рукопись.
По дороге встретил рукопись.
Далеко-далеко за словесными горами в стране гласных и согласных живут рыбные тексты. Вдали от всех живут они в буквенных домах на берегу Семантика большого языкового океана.

With target selector

По дороге встретил рукопись.
По дороге встретил рукопись.
Далеко-далеко за словесными горами в стране гласных и согласных живут рыбные тексты. Вдали от всех живут они в буквенных домах на берегу Семантика большого языкового океана.

Соответствие/выравнивание только для строк (rows)

По дороге встретил рукопись.
По дороге встретил рукопись.
По дороге встретил рукопись.
Далеко-далеко за словесными горами в стране гласных и согласных живут рыбные тексты. Вдали от всех живут они в буквенных домах на берегу Семантика большого языкового океана.
По дороге встретил рукопись.
По дороге встретил рукопись.
По дороге встретил рукопись.
По дороге встретил рукопись.
По дороге встретил рукопись.