BohdanK
@BohdanK

Как переместить колонки с одной строки в другую с помощью bootstrap?

Есть следующий код: jsfiddle.net/akrhF/49
К примеру нужно переместить 5-ю плитку на 4-е место, а 4-ю на 5-е. Когда я прописываю col-sm-push-3 для 4-й плитки и col-sm-pull-3 для 5-й, то они просто уезжают: jsfiddle.net/akrhF/51

Хочу подчеркнуть что если менять колонки местами в пределах одной строки (4-х плиток), то все работает.

Может быть так вообще делать нельзя? В документации указано что pull - push применяется для изменения порядка колонок в row, а в какой row не понятно, в контейнере с классом row или просто в пределах одной строки (то есть в пределах col-xs/sm/md/lg-12). Склоняюсь уже к тому что придется DOM скриптами перестраивать.
  • Вопрос задан
  • 1459 просмотров
Решения вопроса 1
iscareal
@iscareal
Front-End Developer
Возможно вам просто стоит учесть то, что когда вы пишите col-sm-push-3, то ваша колонка сдвинется на три колонки вправо начиная С первого брейкопинта (по-умолчанию в бутстрапе sm - это 768px) и ДО бесконечности. Если вы меняете ширину колонок на каждом брейкпоинте, то и классы "pull" и "push" вам нужно указывать для каждого брейкпоинта.
---
Если вы загляните в код, то бутстрап перемещает колонки между собой с помощью position: relative. А именно, когда вы пишете push-2, то колонка сдвигается относительно своего положения на две колонки вправо. pull-2 же свдигает на две колонки влево. Колонки находящиеся в разных рядах отсортированы стандартными средствами BS быть не могут.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы