Gallery Widget in Allowed Header Section – Clean Home Theme

  • Unknown's avatar

    Hello – the gallery behaves nice with a snippet of code whereby 4 thumbnail book images are side by side, centered, and inline.

    It all goes awry when the 5th and final book is added to the gallery.

    Adding the display:inline code forces the books to remain on the same row. That’s good. But then, the books are no longer centered; they are left aligned instead AND the final 2 books resize and become larger than the other 3 thumbnail size books.

    I would like all 5 books to remain inline, same size, and centered. This code with the added display:inline piece brings the 5 books inline, but the centering goes away. I guess I need a width area that is dynamic so that the images remain the same size. And I need an extra piece of code that recreates centering even when I have the display:inline code.

    Any further help would be very much appreciated!

    div.gallery-row {
    margin: 0 auto;
    display: inline;
    }

    Any snippets of code that might help fix the two problmes of centering and abnormal size changes for the last two books?

    The blog I need help with is: (visible only to logged in users)

  • Hi again.

    In fact, you can choose the amount of columns to be shown in your gallery. I would say your gallery is configured to show less columns than you currently have, so it split into two rows your images: first with 3 pics and second with the remaining 2. Then it calculates image sizes to has the same global width in the first and the second row (So not the same height).

    If you put both rows in a line, you find this height is not the same, but you have two groups.

    Have you tried to make again the gallery with 5 columns in settings?

    I hope this helps you.

  • Unknown's avatar

    Yes. I put in 5 columns, but it does not work.

  • Hi.

    I see you finally find a solution, isn’t it?

  • The topic ‘Gallery Widget in Allowed Header Section – Clean Home Theme’ is closed to new replies.