jQuery Бесконечный свиток + масонство + CSS-запросы СМИ + nth-child

Question

У меня необычная проблема.

Я использую как манекен jQuery, так и Infinite Scroll на веб-сайте.

http://masonry.desandro.com/

http://www.infinite-scroll.com/

Сайт также реагирует, так что при определенных контрольных точках (480px, 768px, и т.д.) добавить некоторые стили, чтобы изменить порядок коробки, используя селектор п-го ребенка. Чтобы уточнить, каждый кирпич кладки содержит два квадрата, которые переключаются влево или вправо в зависимости от размера экрана. Таким образом, вы увидите что-то вроде этого:

#main-content article:nth-child(2) .first, 
#main-content article:nth-child(2n+8) .first { 
    left: 0; 
} 
#main-content article:nth-child(2) .second, 
#main-content article:nth-child(2n+8) .second { 
    left: 15em; /* 240px/16px = 15em */ 
} 

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

Есть ли способ заставить Infinite Scroll применить все, что связано с моими медиа-запросами? Возможно, есть функция обратного вызова, которая позволит мне заставить Infinite Scroll принять мои стили nth-child или перезагрузить styles.css?

Любая помощь очень ценится. Спасибо,

Answer 1

Idiotic ошибка с моей стороны.

Что происходит, Infinite Scroll добавляет #loading в контейнер ... и так как я использовал nth-child, а не nth-of-type ... мой стиль включал этот элемент.

Все хорошо.