Изображения исчезают, когда я включаю скрипт jQuery для кладки

Question

Я пытаюсь использовать сценарий кладки, чтобы получить изображения в виде галереи без какого-либо зазора в соответствии с изображениями разных размеров. Я попытался инициализировать путь jQuery, но я не могу видеть изображения при инициализации скрипта. но если я не сделал инициализацию сценария, я имею в виду, что не использую кладки, я могу видеть изображения.

Я думаю, что применение сценария position:absolute У меня нет идеи, что происходит.

КОД:

$(document).ready(function() {     
    var $container = $('#p-grid'); 
    // initialize 
    $container.masonry({ 
     columnWidth: 200, 
     itemSelector: '.photos' 
    }); 
    var msnry = $container.data('masonry'); 
}); 

Почему это происходит? В чем проблема? Я делаю это правильно?

Jsfiddle

Answer 1

попробовать что-то вроде этого, FIDDLE

.pic { 
width: 100px; 
height: 100px; 
position: relative 
} 

.pic img { 
    width: 100px; 
    height: 100px; 
}