Masonry Layout Issue

  • Hello,

    In the demo version, the masonry layout slots items into space leaving no gaps regardless of image size.

    On my installation of VP the items are stacking up against one another, leaving gaps between items, a bit like tiles as oppose to masonry, although masonry layout is chosen.

    To achieve a masonry layout like the demo do I have to amend the CSS or does the plugin already have this feature?

    Any help would be appreciated.
    —————-
    UPDATE

    The demo version has this css :
    <div class="vp-portfolio__item-wrap" data-vp-filter="building" style="position: absolute; left: 0%; top: 0px;">

    but my installation does not. I tracked this down to the class-get-portfolio.php file and when I try to add in the inlin styling it breaks the portfolio.

    —————-

    UPDATE

    The problem seems to lie only with the first image in the portfolio. For some reason teh first image is adding extra space below itself. Its not a margin or padding but has a height of 600%. Removing the 600% does nothing though.

    • This topic was modified 6 years, 4 months ago by chaten.
    • This topic was modified 6 years, 4 months ago by chaten.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter chaten

    (@chaten)

    Update
    —————
    After loading several items into the gallery, the problem seems to persist through several different items which are in column one throughout the gallery.

    If I swicth to a tiled and use a masonry looking layout, the same problem persists.

    If I change the CSS of the size of the columns eg width greater then 50% then the layout becomes one column but the gap issue goes away.

    Still trying to figure it out.
    Any tips would be appreciated.

    Plugin Author Nikita

    (@nko)

    Hi.

    Could you show me this masonry gallery, that has 600% height? I see on your site Justified layout, that works fine.

    All demo layouts work without additional CSS https://wp.nkdev.info/free-visual-portfolio/

    Thread Starter chaten

    (@chaten)

    Hello,

    Thanks.I’ve setup a test page here highlighting the problem.
    https://185.119.172.152/~concepts/testing/

    The first item (Safeserve) has a big gap below it. And then some of the following items in the left hand column have teh same big gap. The items with gaps will vary according to the order of items but in general its always items on the left that has the problem (but not always all items on the left).

    This also happens with any sort of masonry style layout ie. even the tiled layout with uneven image spaces.

    Plugin Author Nikita

    (@nko)

    I see only 404

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Masonry Layout Issue’ is closed to new replies.