Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #205771

    Hi guys,

    Wondering how to create some space between the thumbs in a gallery. Please have a look here –

    Thanks in advance!


    Hi David!

    Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as needed

    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a {
    margin-right: 10px;



    Hi Yigit,

    I applied a universal margin of 5px to crate even space all the way around HOWEVER, I have selected to display 3 columns but it is only showing 2

    How can I adjust this so 3 columns are displayed?



    Please add following code to Quick CSS as well

    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a {
    width: 32.3333%;



    Hey Yigit –

    Doesn’t seem that change did anything. I have implemented with/without !important.



    It seems like code is not being applied. Please try adding the code to bottom of Style.css file of your child theme in Appearance > Editor

    Best regards,


    Almost there Yigit. It worked for pc, but responsive view jumps down to 2 column again.



    Following code should do it

    @media only screen and (max-width: 1140px) and (min-width: 990px) {
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 32.2%!important; }}
    @media only screen and (max-width: 989px) and (min-width: 768px) {
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 31.8%!important; }}
    @media only screen and (max-width: 767px) and (min-width: 481px) {
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 30.9%!important; }}
    @media only screen and (max-width: 480px) {
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 29.5%!important; }}



    Yigit – you did it. Works like a charm. Much appreciated.

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

The topic ‘Enfold > gallery > Small thumbs > space between images’ is closed to new replies.