SOLVED

Image web part carousel size

Copper Contributor

Hello

 

Can someone direct me to information or is able to tell me what should the size be of the images within the image gallery web part so it fits the size of the carousel and doesn't show grey borders on either sides of the image as shown below. 

 

priya216_0-1646301938595.png

 

My image size is according to the aspect ratio 16:9 and I have tried chnaging this size by going very large width wise or going small but the carousel seems to always show this grey border.

Does anyone have any idea why its doing this and how can I remove it ?

 

Thanks, much appreciate your help.

 

regards

 

Priya

8 Replies
Hello David,

I have read through these sites already and it gives me image sizes and I have set my image size to what its meant to be but still the grey borders still show.

To test the web part I changed my image size to a small size thinking I will see a large grey border but it still showed the same grey border around the image.

Any ideas ?

Thanks

Priya
best response confirmed by priya216 (Copper Contributor)
Solution

Hello @priya216 

 

when i use a picture with dimension 1920 x 1080, then i looks really good without a grey border.

 

I have tested with this background images ;)

https://www.microsoft.com/en-us/microsoft-365/blog/2021/07/08/get-nostalgic-with-new-microsoft-teams...

 

Regards, Dave

Hi David,

Can you send me a screenshot of your image carousel please ?

Thank you

Priya

Hi @priya216 

 

sure, have a look.

 

Regards, Dave

Hello David,
Thank you for your suggestion of image sizes, I resized all my images once again and I have added it back to the image gallery and the grey borders have gone. Thank you so much.

I added my image gallery to my live environment but the image gallery carousel doesn't show the automated settings. It seems the automation setting is for targeting release. Would you know when it will be available for standard release ?

Thanks

Priya

Hi @priya216 

 

sounds good.

 

Oh no, didn't read it explicit on the roadmap, i think its not a long way to standard release.

 

Regards, Dave

Hi @priya216
This certainly can be tricky at first, especially when trying to figure out responsive design. For ease, I've created the SharePoint Content Creators Toolkit, which is 100% free to download and use. 

> Figma Download: https://lnkd.in/e9TvKxEy
> PDF Download: https://lnkd.in/eGFQgBPv

The SharePoint Content Creator’s Kit contains several components, templates, best practices, and other resources for creating your SharePoint site. This design kit shows how to take advantage of SharePoint's user interface capabilities and helps you focus on user experiences and best practice design standards.

Simply paste in your desired image, preview how it will appear in the generator, and export! It couldn't be easier.
1 best response

Accepted Solutions
best response confirmed by priya216 (Copper Contributor)
Solution

Hello @priya216 

 

when i use a picture with dimension 1920 x 1080, then i looks really good without a grey border.

 

I have tested with this background images ;)

https://www.microsoft.com/en-us/microsoft-365/blog/2021/07/08/get-nostalgic-with-new-microsoft-teams...

 

Regards, Dave

View solution in original post