alignment settings

Hi nparsons. Give this a try:

1. Remove the nbsp; code between the galleries.

2. Add this to your custom CSS:

/* galleries in 2 columns */
div[id^="foogallery-album-"] {
    width: 50%;
    float: left;
}

/* galleries 1 column on mobile */
@media screen and (max-width: 919px) {
    div[id^="foogallery-album-"] {
      width: 100%;
    }
}

Since each gallery container has a common id with a unique numeric suffix we can use an element attribute to target them all. The above CSS finds any <div> element with an “id” attribute that has a name beginning with “foogallery-album-“.

Hi, thanks for the help. I can’t see the nbsp; as the gallery uses shortcodes. This is what I see.

[foogallery-album id=”497″] ?[foogallery-album id=”496″]

I have just added the code and it seemed to work, kind of. The albums are side by side but not aligned horizontally?

It’s due to the non-breaking space code. Can you see it in the Text (not Visual) editor?

No, I have looked in visual and text, but cannot see the nbsc! For some reason…

[foogallery-album id=”497″] [foogallery-album id=”496″]

What if you remove the space between the two shortcodes?