Ответить Новая тема Новый опрос 
 Выравнивание вертикального меню [Решение!]
IrbisDev
Новичок
Сообщений: 7
Регистрация: 12-07-2015


02-10-2016 15:40
Всё что нужно сделать, это прописать два простых правила в файле superfish-modified.css

.sf-menu > li:first-child > ul > li {
width: 25%;
}

.sf-menu > li:first-child > ul> li:nth-child(4n+1) {
clear: left ;
}

Для первого пункта меню(основной раздел товарного каталога, у кого то их несколько или все, тогда удаляем :first-child) прописываем вывод в 4 колонки(не 5 как в стандартной теме, а 4). 4 потому что нам нужно число кратное 2, потому что планшетный вывод использует 2 колонки. И так, вывод 4 колонки, нам нужно каждому следующему элементу идущему после каждого 4 элемента очистить обтекание, т.е. 4n+1

Всё! имеем адаптивный вариант меню которое всегда остаётся ровным, т.е. не едет!

Всем удачи!


Сообщение отредактировал IrbisDev (02-10-2016 16:42)
 
Вне форума
ПМ Отправить эл.сообщение 
Щелкните, и это сообщение будет добавлено в ваш ответ как цитата Цитировать этот ответ
IrbisDev
Новичок
Сообщений: 7
Регистрация: 12-07-2015


02-10-2016 16:25
Вариант для тех кто не хочет менять количество столбцов, т.е. вывод в 5 столбцов

.sf-menu > li:first-child > ul> li:nth-child(5n+1) {
clear: left ;
}
@media (max-width: 767px) {
.sf-menu > li:first-child > ul> li:nth-child(2n+1) {
clear: left ;
}

.sf-menu > li:first-child > ul> li:nth-child(5n+1) {
clear: none;
}

}


Сообщение отредактировал IrbisDev (02-10-2016 17:25)
 
Вне форума
ПМ Отправить эл.сообщение 
Щелкните, и это сообщение будет добавлено в ваш ответ как цитата Цитировать этот ответ
Ответить Новая тема Новый опрос