Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #19811

    Hi,

    How can I have a gap between each portfolio entry? A gap in white would probably be enough on the sides and below each thumb.

    Thank you

    #105136

    Hi sitesme,

    You can add some padding or gap between each portfolio item by adding this code on your Quick CSS (located inside Choices > Theme Options > Styling) or custom.css (located inside wp-content/themes/choices/css):

    .avia_sortable_active .isotope .isotope-item {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px;
    }

    just adjust the padding value this adds 5px on top right bottom and left of each portfolio item. Hope this helps.

    Regards,

    Ismael

    #105137

    Hi Ismael,

    The code worked fine for the sides, but I would like the padding to be around the whole image.

    Can you please tell me the code to have a simple padding all the way around to look like a white frame around each image?

    And also the code to have a line with 5px probably to make a grid to separate all images. I would like to try both to see how it looks.

    At the moment, there is a mosaic effect which blends the images and you can’t really separate each item visually.

    Thank you

    #105138

    Hi sitesme,

    The code above from Ismael should be giving it a full 5px bit of padding on every item. I just tested it on my live install and didn’t have any issue. If you can link to your site with that css in your custom.css file or Quick CSS (in the styling tab) we can see whats going on and why it isn’t taking effect on your end.

    The grid however is actually a bit difficult to do correctly. The border could just be added to that css, but it actually adds to the size of its container so the whole layout gets thrown off by the amount of the border. eg:

    .avia_sortable_active .isotope .isotope-item {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px;
    border: 1px solid black;
    }

    If you wanted to fully customize the portfolio layout, you would need to look into a freelance developer to do the adjustments as its a bit beyond what we can do through support.

    Regards,

    Devin

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Space / Padding between portfolio items’ is closed to new replies.