Gallery in outsystems Mobile

Good day. I currently have this gallery of photos with max of 4 items per row. I would like to know if in case the number of items is less than 4 in the next row, would it be possible to align center the remaining items so it would look like this:

Currently it looks like this:

Thank you for your help.

Disclaimer: All the photos in this sample project are from sample data in outsystems.

Hi Everyone. I was able to make use of this style to achieve this look. Please refer to the CSS below and hope this may help someone looking for the same effect in the future. Thank you.

.custom-alignment {
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 flex-wrap: wrap !important;
 width: 100% !important;
 max-width: 600px;
}
mvp_badge
MVP

Hi Jerome,

The Gallery component create the number of columns as your choice, even if it's empty.

See:

So I guess that's no possible.

Regards,

Leandro.

mvp_badge
MVP

Hi Jerome, 

I dont think it is possible. @Leandro  is right because it fixed column content.

else you will need to create custom div and set item in this

Regards

Rahul Sahu

Hi Everyone. I was able to make use of this style to achieve this look. Please refer to the CSS below and hope this may help someone looking for the same effect in the future. Thank you.

.custom-alignment {
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 flex-wrap: wrap !important;
 width: 100% !important;
 max-width: 600px;
}
mvp_badge
MVP

Nice Jerome!

mvp_badge
MVP

Nice job  Jerome :-)


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.