Проблема с width в owl carousel 2.2.1

Всем доброго вечера. Возникла проблема с owl carousel, при первой загрузке страницы width равен 0 и, естественно, слайдер не отображается. После обновления страницы все ок пересчитывается. Никаких ошибок нет, не могу понять, в чем проблема. Может кто сталкивался с подобным?

Инициализация

$(document).ready(function(){
  $('.main_slider').owlCarousel({
    autoplay: true,
    autoplayTimeout: 3000,
    autoplaySpeed: 1000,
    navSpeed: 1000,
    dotsSpeed: 1000,
    dragEndSpeed: 1000,
    loop:true,
    nav:true,
    thumbs: false,
    navText: ['<i class="icon-prew"></i>','<i class="icon-next"></i>'],
    navContainer: '.arrows',
    center: true,
    responsiveClass:true,
    responsive:{
        0:{
            items:1,
        },
        600:{
            items:1,
        },
        1200:{
            items:3,
            autoWidth: true,
        }
    }
})
});

Стиль owl stage при первичной загрузке - transition: 1s; width: 0px; transform: translate3d(960px, 0px, 0px);.

Разметка:

<div class="slider_arrows">
    <div class="main_slider owl-carousel">
        <?php $posts = get_slider(); foreach ($posts as $post): setup_postdata($post);?>
        <img src="<?php the_post_thumbnail_url('slider-img'); ?>" alt="<?php the_title();?>">
        <?php endforeach; wp_reset_postdata();?>
    </div>
    <div class="arrows_block">
        <div class="arrows container"></div>
    </div>
</div>

Удалять WP функции не стал.

Очень странно, ведь ставил owl carousel на другом проекте, той же версии и с похожими настройками, там все ок... Мистика ))